:root {
  --bg: #f5f7f4;
  --panel: #ffffff;
  --text: #20231f;
  --muted: #747a73;
  --line: #e6e9e4;
  --lime: #b9ef59;
  --accent: #b9ef59;
  --lime-dark: #8fc62d;
  --lime-soft: #effbd9;
  --dark: #1d241d;
  --danger: #e96969;
  --warning: #f0a94a;
  --purple: #8969e8;
  --shadow: 0 10px 40px rgba(32, 46, 28, .07);
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font-family: Inter, "Segoe UI", Arial, sans-serif; color: var(--text); background: var(--bg); }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button:disabled, select:disabled, input:disabled { cursor: not-allowed; opacity: .58; }
.lucide { display: inline-block; vertical-align: middle; flex: 0 0 auto; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
.lime-text { color: #72a719; }

.login-screen { min-height: 100vh; display: grid; grid-template-columns: 1.12fr .88fr; background: #fff; }
.login-art { position: relative; overflow: hidden; padding: 42px 52px; background: #20291e; color: #fff; min-height: 680px; }
.brand { display: flex; align-items: center; gap: 9px; font-weight: 900; font-size: 22px; letter-spacing: -.6px; }
.brand-light { color: #fff; position: relative; z-index: 2; }
.brand-symbol { position: relative; display: block; overflow: hidden; flex: 0 0 auto; width: 38px; height: 38px; background: #fff; border-radius: 11px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.04); }
.brand-symbol img { position: absolute; width: 94px; max-width: none; left: -28px; top: -16px; }
.brand-word { color: #252925; font-size: 21px; font-weight: 850; letter-spacing: -1px; }
.brand-word i { color: #72c908; font-style: normal; }
.brand-light .brand-word { color: #fff; }
.login-copy { position: relative; z-index: 2; max-width: 590px; margin-top: 19vh; }
.eyebrow { font-size: 11px; font-weight: 800; letter-spacing: 1.7px; margin-bottom: 18px; }
.login-copy h1 { font-size: clamp(46px, 5vw, 76px); line-height: .98; letter-spacing: -4px; margin: 0 0 28px; }
.login-copy p { color: #bac3b7; max-width: 500px; font-size: 17px; line-height: 1.6; }
.orbit { position: absolute; border: 1px solid rgba(185,239,89,.22); border-radius: 50%; }
.orbit::after { content: ""; position: absolute; width: 18px; height: 18px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 40px var(--lime); }
.orbit-one { width: 520px; height: 520px; right: -110px; bottom: -190px; }
.orbit-one::after { left: 42px; top: 84px; }
.orbit-two { width: 780px; height: 780px; right: -380px; bottom: -370px; }
.orbit-two::after { left: 130px; top: 42px; width: 10px; height: 10px; }
.login-stat { position: absolute; left: 52px; bottom: 44px; z-index: 2; display: flex; gap: 12px; align-items: center; }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #77c944; box-shadow: 0 0 0 4px rgba(119,201,68,.12); }
.login-stat div { display: flex; flex-direction: column; gap: 4px; }
.login-stat small { color: #98a195; }
.login-panel { display: grid; place-items: center; padding: 48px; }
.login-form { width: min(410px, 100%); display: flex; flex-direction: column; gap: 24px; }
.login-form h2 { font-size: 36px; letter-spacing: -1.4px; margin: 0 0 7px; }
.login-form p { margin: 0; }
.login-mobile-brand { display: none; }
.field { display: flex; flex-direction: column; gap: 8px; font-size: 13px; font-weight: 700; }
.field input, .field select, .field textarea {
  width: 100%; height: 48px; border: 1px solid var(--line); border-radius: 12px; padding: 0 14px; outline: none; background: #fff;
}
.field textarea { height: 84px; padding-top: 12px; resize: vertical; }
.field small { color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.4; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px rgba(185,239,89,.22); }
.password-wrap { position: relative; }
.password-wrap input { padding-right: 48px; }
.icon-button { position: absolute; right: 5px; top: 5px; width: 38px; height: 38px; border: 0; background: transparent; cursor: pointer; color: var(--muted); }
.password-control { position: relative; }
.password-control input { padding-right: 48px; }
.password-visibility {
  position: absolute; right: 5px; top: 5px; width: 38px; height: 38px; border: 0; border-radius: 10px;
  background: transparent; color: var(--muted); cursor: pointer; display: grid; place-items: center;
}
.password-visibility:hover { background: #f3f6f0; color: var(--text); }
.primary-button, .secondary-button, .ghost-button, .danger-button {
  border: 0; border-radius: 11px; height: 42px; padding: 0 17px; color: inherit; text-decoration: none; font: inherit; font-weight: 750; cursor: pointer; display: inline-flex; gap: 9px; align-items: center; justify-content: center;
}
.primary-button:focus-visible, .secondary-button:focus-visible, .ghost-button:focus-visible, .danger-button:focus-visible { outline: 2px solid rgba(143,198,45,.38); outline-offset: 2px; }
.primary-button { background: var(--lime); color: #1d241d; }
.primary-button:hover { background: #aee846; }
.secondary-button { background: var(--dark); color: #fff; }
.ghost-button { background: #f0f2ef; }
.danger-button { background: #fff0f0; color: #bd4444; }
.login-button { height: 52px; justify-content: space-between; padding: 0 20px; }
.demo-hint { border: 1px dashed #d8ddd4; background: #fafbf9; padding: 12px 14px; border-radius: 11px; color: var(--muted); font-size: 12px; }
.legal-consent-field { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; align-items: start; color: #596154; font-size: 11px; font-weight: 600; line-height: 1.5; }
.legal-consent-field input { width: 16px; height: 16px; margin: 1px 0 0; accent-color: var(--lime-dark); }
.legal-consent-field a { color: #507d17; font-weight: 800; text-underline-offset: 2px; }
.form-error { color: #b93f3f; background: #fff0f0; border-radius: 9px; padding: 10px 12px; font-size: 13px; }
.auth-links { display: flex; justify-content: space-between; gap: 12px; }
.auth-links button { border: 0; padding: 0; background: transparent; color: #60951a; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }

.app { min-height: 100vh; display: grid; grid-template-columns: 260px 1fr; grid-template-rows: 72px 1fr; }
.topbar { position: relative; grid-column: 1 / -1; display: flex; align-items: center; gap: 20px; padding: 0 22px; background: #fff; border-bottom: 1px solid var(--line); z-index: 30; }
.topbar .brand { width: 218px; }
.workspace-switch { display: flex; align-items: center; gap: 11px; height: 48px; padding: 0 14px; background: #f1f3f0; border: 0; border-radius: 14px; min-width: 225px; cursor: pointer; text-align: left; }
.workspace-switch:hover, .user-menu:hover { background: #ecefe9; }
.workspace-copy, .user-copy { display: flex; flex-direction: column; }
.workspace-switch small, .user-menu small { font-size: 10px; color: var(--muted); margin-bottom: 2px; }
.workspace-switch b, .user-menu b { font-size: 13px; }
.workspace-icon { display: grid; place-items: center; width: 30px; height: 30px; background: var(--lime); border-radius: 9px; }
.topbar-spacer { flex: 1; }
.admin-portal-stats {
  display: flex; align-items: stretch; gap: 0; min-width: 330px; height: 46px; padding: 4px;
  border: 1px solid #dce9ce; border-radius: 14px; background: linear-gradient(135deg, #fbfef7, #f2f9e9);
  color: var(--text); font: inherit; cursor: pointer; box-shadow: 0 5px 16px rgba(91, 133, 34, .07);
}
.admin-portal-stats:hover { border-color: #badb87; background: #f5fbe9; }
.admin-portal-stats:focus-visible { outline: 2px solid rgba(117, 174, 39, .42); outline-offset: 2px; }
.admin-portal-stats-icon { display: grid; flex: 0 0 34px; place-items: center; margin-right: 2px; border-radius: 10px; background: var(--lime); color: #2d4810; }
.admin-portal-stats-icon svg { width: 18px; height: 18px; }
.admin-portal-stat { position: relative; display: flex; min-width: 88px; padding: 3px 9px; flex-direction: column; justify-content: center; text-align: left; }
.admin-portal-stat + .admin-portal-stat::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 1px; background: #dfe8d8; }
.admin-portal-stat b { color: #5e9814; font-size: 14px; line-height: 1; }
.admin-portal-stat:nth-of-type(3) b { color: #b47411; }
.admin-portal-stat:nth-of-type(4) b { color: #2d751f; }
.admin-portal-stat small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1; white-space: nowrap; }
.superadmin-session #subscriptionPill { display: none; }
.sync-pill { border: 1px solid #dfe8d8; color: #4f7044; padding: 8px 12px; border-radius: 10px; font-size: 12px; background: #f8fcf5; }
.top-icon { position: relative; width: 38px; height: 38px; border: 0; background: transparent; border-radius: 10px; cursor: pointer; font-size: 19px; }
.top-icon.mobile-nav-button { display: none; }
.top-icon { display: grid; place-items: center; }
.top-icon:hover { background: #f0f2ef; }
.notification-dot { position: absolute; top: 6px; right: 6px; width: 8px; height: 8px; background: var(--danger); border: 2px solid #fff; border-radius: 50%; box-sizing: content-box; }
.top-icon.has-unread { background: #f7fbef; color: #4f7f12; }
.feedback-admin-badge { position: absolute; top: -3px; right: -5px; display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border: 2px solid #fff; border-radius: 999px; background: var(--danger); color: #fff; font-size: 9px; font-weight: 850; line-height: 1; box-shadow: 0 3px 9px rgba(208, 65, 74, .24); }
.top-icon.has-admin-feedback { background: #f7fbef; color: #4f7f12; }
.user-menu { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border: 0; border-radius: 13px; background: #f5f6f4; cursor: pointer; text-align: left; }
.avatar { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #d9b4e9; color: #fff; font-weight: 800; }
.top-dropdown { position: absolute; top: 64px; z-index: 80; min-width: 300px; padding: 9px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 18px 50px rgba(25,34,22,.16); }
.workspace-dropdown { left: 255px; }
.user-dropdown { right: 60px; min-width: 280px; }
.dropdown-title { padding: 9px 10px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase; }
.dropdown-option { width: 100%; display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 8px 10px; border: 0; border-radius: 10px; background: transparent; cursor: pointer; text-align: left; }
.dropdown-option:hover { background: #f3f6ef; }
.dropdown-option.active { background: var(--lime-soft); color: #588b13; }
.dropdown-option > svg { width: 18px; height: 18px; }
.dropdown-option div { display: flex; flex: 1; flex-direction: column; gap: 3px; }
.dropdown-option b { font-size: 12px; }
.dropdown-option small { color: var(--muted); font-size: 10px; }
.dropdown-separator { height: 1px; margin: 7px 5px; background: var(--line); }
.dropdown-profile { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 11px; padding: 10px; }
.dropdown-profile b, .dropdown-profile small { display: block; }
.dropdown-profile small { margin-top: 3px; color: var(--muted); font-size: 10px; }

.sidebar { grid-row: 2; padding: 18px 14px 14px; background: #fff; border-right: 1px solid var(--line); display: flex; flex-direction: column; overflow-y: auto; max-height: calc(100vh - 72px); }
.nav-item, .nav-subitem { width: 100%; color: inherit; text-align: left; text-decoration: none; border: 0; background: transparent; cursor: pointer; border-radius: 10px; }
.nav-item { padding: 11px 11px; font-size: 13px; line-height: 1.2; font-weight: 760; display: flex; gap: 10px; align-items: center; margin-bottom: 7px; }
.nav-item.active, .nav-subitem.active { background: var(--lime-soft); color: #598d10; }
.nav-section { margin: 5px 0 12px; }
.nav-caption { display: flex; align-items: center; gap: 9px; padding: 9px 11px 8px; font-size: 12.5px; line-height: 1.2; font-weight: 820; }
.nav-caption i { margin-left: auto; font-style: normal; color: var(--muted); }
.nav-caption > svg:last-child { margin-left: auto; color: var(--muted); }
.nav-item > svg, .nav-caption > svg:first-child, .nav-subitem > svg { width: 19px; height: 19px; flex: 0 0 auto; stroke-width: 2; }
.nav-subitem { display: flex; align-items: center; gap: 9px; padding: 8px 11px 8px 31px; font-size: 12.5px; line-height: 1.2; margin: 2px 0; }
.nav-item span, .nav-caption span, .nav-subitem span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-item.active > svg, .nav-subitem.active > svg, .nav-section:has(.nav-subitem.active) .nav-caption > svg:first-child { color: #6fae18; }
.nav-section:has(.nav-subitem.active) .nav-caption { color: #6fae18; }
.nav-subitem:hover, .nav-item:hover { background: #f3f5f1; }
.sidebar-bottom { margin-top: auto; }
.health-card { display: flex; gap: 10px; align-items: center; padding: 13px; background: #f6f8f4; border-radius: 12px; }
.health-card div { display: flex; flex-direction: column; }
.health-card b { font-size: 12px; }
.health-card small { color: var(--muted); font-size: 10px; margin-top: 3px; }
.health-icon { display: grid !important; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--lime); }
.version { color: #a0a59e; font-size: 10px; text-align: center; margin-top: 13px; }

.main { grid-column: 2; grid-row: 2; padding: 30px 34px 50px; overflow-x: hidden; max-height: calc(100vh - 72px); overflow-y: auto; }
.subscription-banner { position: sticky; top: -30px; z-index: 20; display: flex; align-items: center; gap: 10px; margin: -30px -34px 18px; padding: 12px 34px; color: #782c2c; background: #fff0ef; border-bottom: 1px solid #f0cbc8; }
.subscription-banner button { margin-left: auto; padding: 8px 12px; border: 0; border-radius: 9px; background: #a83f3a; color: #fff; font-weight: 700; cursor: pointer; }
.subscription-banner svg { width: 18px; }
.status-dot.danger { background: var(--danger); }
.page-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; margin-bottom: 22px; }
.page-title h1 { margin: 0 0 6px; font-size: 29px; letter-spacing: -1.1px; }
.page-title p { margin: 0; color: var(--muted); font-size: 13px; }
.page-actions { display: flex; gap: 9px; }
.filters { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; padding: 12px; background: #fff; border: 1px solid var(--line); border-radius: 14px; margin-bottom: 20px; }
.date-field { height: 40px; padding: 0 10px; border: 1px solid var(--line); background: #f7f8f6; border-radius: 10px; color: #4f544e; }
.filter-divider { color: #a1a69f; }
.filter-select { position: relative; }
.filter-select summary { list-style: none; cursor: pointer; height: 40px; min-width: 160px; display: flex; align-items: center; justify-content: space-between; gap: 15px; background: #f1f3f0; border-radius: 10px; padding: 0 12px; font-size: 12px; font-weight: 700; }
.filter-select summary > span { display: flex; flex-direction: column; gap: 2px; }
.filter-select summary > span small { color: var(--muted); font-size: 9px; font-weight: 500; }
.filter-select summary > span b { font-size: 12px; }
.filter-select summary::-webkit-details-marker { display: none; }
.filter-select[open] summary { box-shadow: 0 0 0 2px rgba(185,239,89,.4); }
.filter-popover { position: absolute; top: 46px; left: 0; z-index: 140; min-width: 270px; max-height: 310px; overflow-y: auto; padding: 9px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); }
.month-filter-select summary { min-width: 190px; }
.month-filter-popover { min-width: 270px; }
.check-option { display: flex; align-items: center; gap: 9px; padding: 9px; border-radius: 8px; font-size: 12px; cursor: pointer; }
.check-option:hover { background: #f4f6f2; }
.check-option span { display: flex; flex-direction: column; gap: 2px; }
.check-option small { color: var(--muted); font-size: 9px; font-weight: 500; }
.check-option-all { margin-bottom: 5px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.check-option input { accent-color: var(--lime-dark); width: 16px; height: 16px; }
.market-chips { display: flex; gap: 6px; }
.market-chip { border: 1px solid var(--line); background: #fff; height: 34px; border-radius: 9px; padding: 0 10px; cursor: pointer; font-size: 11px; font-weight: 750; }
.market-chip.active { border-color: #9dcd4d; background: var(--lime-soft); }
.filters-spacer { flex: 1; }
.reset-filter { border: 0; background: transparent; color: var(--muted); font-size: 12px; cursor: pointer; }

.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(180px, 1fr)); gap: 14px; margin-bottom: 16px; }
.kpi-card { background: #fff; border: 1px solid var(--line); border-radius: 15px; padding: 17px 18px; min-height: 125px; }
.kpi-head { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 12px; }
.kpi-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: var(--lime-soft); color: #639a16; }
.kpi-value { display: block; margin: 17px 0 8px; font-size: 25px; letter-spacing: -.8px; }
.kpi-foot { font-size: 11px; color: var(--muted); }
.positive { color: #4e982f; }
.negative { color: #cf5252; }
.content-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr); gap: 16px; margin-bottom: 16px; }
.content-grid > .panel { min-width: 0; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: 15px; padding: 18px; }
.panel-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.panel-header h2 { margin: 0; font-size: 16px; }
.panel-header small { color: var(--muted); }
.chart-wrap { min-height: 295px; overflow-x: auto; overflow-y: visible; }
.chart-wrap svg { width: 100%; height: 100%; overflow: visible; }
.chart-grid { stroke: #e9ece7; stroke-width: 1; }
.chart-line { fill: none; stroke: #78bd22; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 6px 10px rgba(120, 189, 34, .18)); }
.chart-area { fill: url(#areaGradient); }
.chart-label { fill: #92978f; font-size: 10px; }
.dashboard-chart-panel { min-width: 0; }
.dashboard-chart-panel .panel-header { align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.dashboard-chart-controls { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.dashboard-chart-wrap { width: 100%; min-width: 0; overflow-x: hidden; }
.dashboard-chart-box { display: flex; flex-direction: column; gap: 8px; width: 100%; min-width: 0; max-width: 100%; height: 100%; min-height: 295px; }
.dashboard-chart-box svg { display: block; flex: 1; width: 100%; max-width: 100%; min-height: 250px; }
.dashboard-chart-box .chart-zero-line { stroke: #aeb5aa; stroke-width: 1.2; stroke-dasharray: 5 5; }
.dashboard-chart-legend { justify-content: space-between; }
.dashboard-chart-legend i { background: #78bd22; }
.dashboard-chart-legend small { margin-left: auto; color: var(--muted); }
.dashboard-chart-hit { fill: transparent; pointer-events: all; }
.dashboard-chart-focus { stroke: #d4e8bd; stroke-width: 1.2; stroke-dasharray: 4 5; opacity: 0; transition: opacity .12s ease; }
.dashboard-chart-point,
.dashboard-chart-point-base { fill: #fff; stroke: #78bd22; stroke-width: 3; }
.dashboard-chart-point { transition: r .12s ease, filter .12s ease, opacity .12s ease; }
.dashboard-chart-point-hover { opacity: 0; }
.dashboard-chart-tooltip { display: none; pointer-events: none; }
.dashboard-chart-tooltip rect { fill: #fff; stroke: #e4eddb; filter: url(#dashboardTooltipShadow); }
.dashboard-chart-day:hover .dashboard-chart-focus { opacity: 1; }
.dashboard-chart-day:hover .dashboard-chart-point { r: 6; opacity: 1; filter: drop-shadow(0 4px 8px rgba(120,189,34,.25)); }
.dashboard-chart-day:hover .dashboard-chart-tooltip { display: block; }
.chart-tooltip-title { fill: #2d3526; font-size: 12px; font-weight: 800; }
.chart-tooltip-label { fill: #7d8775; font-size: 11px; }
.chart-tooltip-value { fill: #2d3526; font-size: 11px; font-weight: 800; }
.market-list { display: flex; flex-direction: column; gap: 17px; }
.market-row-head { display: flex; align-items: center; gap: 9px; margin-bottom: 7px; font-size: 12px; }
.market-row-head b { margin-left: auto; }
.market-icon { flex: 0 0 auto; display: grid; place-items: center; width: 27px; height: 27px; border-radius: 8px; color: #fff; font-size: 10px; font-weight: 900; text-transform: uppercase; }
.market-icon.wildberries { background: linear-gradient(135deg, #ad28db, #ef237e); }
.market-icon.ozon { background: #1769ff; }
.market-icon.yandex { background: #ffd426; color: #222; }
.progress { height: 7px; background: #edf0eb; border-radius: 10px; overflow: hidden; }
.progress span { display: block; height: 100%; border-radius: inherit; background: var(--lime-dark); }
.market-account-list { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 0 36px; }
.market-account-row { padding: 8px 9px; border: 1px solid #edf1e8; border-radius: 10px; background: #fbfcfa; }
.market-account-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 9px; align-items: center; font-size: 11px; }
.market-account-head span { font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.market-account-head small { grid-column: 1; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.market-account-head b { grid-row: 1 / 3; grid-column: 2; font-size: 12px; }
.market-account-progress { height: 5px; margin-top: 7px; border-radius: 8px; background: #eef2ea; overflow: hidden; }
.market-account-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #b9ef59, #7cc42a); }
.market-account-empty { margin: 8px 0 0 36px; color: var(--muted); font-size: 11px; }

.table-panel { padding: 0; overflow: hidden; }
.table-toolbar { display: flex; align-items: center; gap: 10px; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.table-toolbar h2 { margin: 0; font-size: 16px; }
.table-toolbar .search { margin-left: auto; }
.toolbar-counter { color: var(--muted); font-size: 11px; white-space: nowrap; }
.toolbar-select { min-height: 38px; border: 1px solid var(--line); border-radius: 10px; background: #fff; padding: 0 34px 0 12px; color: var(--text); font: inherit; font-size: 12px; }
.toolbar-select:focus { border-color: #9dcd4d; outline: none; box-shadow: 0 0 0 2px rgba(185,239,89,.25); }
.search { height: 38px; min-width: 230px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; outline: none; background: #f8f9f7; }
.search:focus { border-color: #9dcd4d; }
.data-table-wrap { overflow: auto; }
.data-table { width: max-content; min-width: 100%; border-collapse: collapse; font-size: 12px; }
.data-table th { position: sticky; top: 0; z-index: 2; text-align: left; padding: 11px 14px; color: var(--muted); background: #f7f8f6; border-right: 1px solid #dfe3dc; font-weight: 700; white-space: nowrap; }
.data-table th.sortable-th { cursor: pointer; user-select: none; }
.data-table th.sortable-th button { border: 0; background: transparent; color: inherit; font: inherit; padding: 0; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.data-table th.sortable-th button > span:last-child { display: inline-grid; place-items: center; min-width: 18px; height: 18px; border-radius: 7px; background: #edf1e8; color: #75806f; font-size: 11px; }
.data-table th.sortable-th.active { color: #30372d; background: #eef6e3; }
.data-table th.sortable-th.active button > span:last-child { background: var(--accent); color: #263018; }
.data-table th.sortable-th { position: sticky; }
.column-comment {
  position: absolute; z-index: 40; left: 50%; top: calc(100% - 7px); width: 255px;
  display: none; padding: 12px; border-radius: 9px; background: #20231f; color: #d7dcd4;
  box-shadow: 0 14px 34px rgba(18,23,17,.22); transform: translateX(-50%);
  font-style: normal; font-weight: 500; line-height: 1.45; white-space: normal; text-align: left;
}
.column-comment::before { content: ""; position: absolute; left: 50%; top: -7px; width: 14px; height: 14px; background: #20231f; transform: translateX(-50%) rotate(45deg); }
.data-table th.sortable-th:hover .column-comment { display: block; }
.data-table th:last-child { border-right-color: transparent; }
.data-table td { padding: 12px 14px; border-top: 1px solid #edf0eb; border-right: 1px solid #f0f2ee; vertical-align: middle; white-space: nowrap; }
.data-table td:last-child { border-right-color: transparent; }
.data-table tr:hover td { background: #f3f4f2; border-right-color: #fff; }
.data-table .column-hidden { display: none !important; }
.data-table th.column-user-sized {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.3;
}
.data-table th.column-user-sized > button {
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.data-table td.column-user-sized {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.4;
}
.data-table td.column-user-sized > * {
  min-width: 0;
  max-width: 100%;
}
.data-table td.column-user-sized :is(b, strong, small, em, a, p) {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.data-table td.column-user-sized .product-cell,
.data-table td.column-user-sized .product-cell > div {
  min-width: 0;
  max-width: 100%;
}
.column-resizer { position: absolute; z-index: 4; top: 0; right: -3px; width: 7px; height: 100%; cursor: col-resize; touch-action: none; }
.column-resizer::after { content: ""; position: absolute; top: 18%; bottom: 18%; left: 3px; width: 1px; background: #c9cec6; }
.column-resizer:hover::after, .resizing-column .column-resizer::after { background: #8bce3c; }
.resizing-column, .resizing-column * { cursor: col-resize !important; user-select: none !important; }
.table-column-button { margin-left: auto; flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; color: #555d52; }
.table-column-button:hover { border-color: #9dcd4d; color: #537b22; background: #f9fff1; }
.floating-table-scroll { position: fixed; z-index: 90; bottom: 0; height: 17px; overflow-x: auto; overflow-y: hidden; border: 1px solid #daddd7; border-bottom: 0; border-radius: 8px 8px 0 0; background: #fff; box-shadow: 0 -5px 14px rgba(32,42,28,.1); }
.floating-table-scroll > div { height: 1px; }
.floating-table-scroll.hidden { display: none; }
.product-cell { display: flex; align-items: center; gap: 10px; min-width: 240px; }
.product-cell .market-rail { align-self: stretch; width: 4px; border-radius: 3px; }
.market-rail.wildberries { background: #d225a3; }
.market-rail.ozon { background: #1769ff; }
.market-rail.yandex { background: #ffd426; }
.product-cell div { display: flex; flex-direction: column; gap: 4px; }
.product-cell small { color: var(--muted); }
.money { font-variant-numeric: tabular-nums; font-weight: 700; }
.tag { display: inline-flex; align-items: center; padding: 5px 8px; border-radius: 8px; background: #f0f2ef; font-size: 10px; font-weight: 800; }
.tag.a, .tag.success { background: #eaf7df; color: #468b27; }
.tag.b, .tag.warning { background: #fff4da; color: #a36a12; }
.tag.c, .tag.error { background: #ffebeb; color: #bd4949; }
.cost-input { width: 92px; height: 34px; padding: 0 8px; border: 1px solid var(--line); border-radius: 8px; }
.row-action { border: 0; background: transparent; cursor: pointer; color: #679d1c; font-weight: 800; display: inline-flex; align-items: center; gap: 5px; }
.empty-state { text-align: center; padding: 48px 20px; color: var(--muted); }
.loading { min-height: 340px; display: grid; place-items: center; color: var(--muted); }
.spinner { width: 28px; height: 28px; border: 3px solid #e9ece6; border-top-color: var(--lime-dark); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.entity-grid, .integration-grid, .user-grid { display: grid; grid-template-columns: repeat(2, minmax(280px, 1fr)); gap: 14px; }
.entity-card, .integration-card, .user-card { background: #fff; border: 1px solid var(--line); border-radius: 15px; padding: 17px; }
.entity-card-head, .integration-head, .user-card-head { display: flex; align-items: center; gap: 11px; }
.entity-card-head h3, .integration-head h3, .user-card h3 { margin: 0 0 4px; font-size: 15px; }
.entity-card-head p, .integration-head p, .user-card p { margin: 0; color: var(--muted); font-size: 11px; }
.user-access-summary { display: flex; flex-wrap: wrap; gap: 7px; margin: 14px 0 2px; }
.user-access-summary > span { display: inline-flex; align-items: center; gap: 5px; padding: 6px 8px; border: 1px solid #e4eadf; border-radius: 9px; background: #f8faf6; color: #66705e; font-size: 10px; font-weight: 700; }
.user-access-summary svg { width: 14px; height: 14px; color: #76a936; }

.permission-intro { display: flex; align-items: flex-start; gap: 11px; padding: 13px; border: 1px solid #dfe9d4; border-radius: 12px; background: #f5faef; }
.permission-intro > svg { flex: 0 0 auto; color: #6d9c30; }
.permission-intro b { font-size: 13px; }
.permission-intro p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.permission-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.permission-tools > b { margin-right: auto; font-size: 13px; }
.permission-matrix { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-height: min(47vh, 490px); overflow-y: auto; padding: 2px; }
.permission-group { min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.permission-group-title, .permission-page { display: flex; align-items: flex-start; gap: 8px; cursor: pointer; }
.permission-group-title { padding-bottom: 8px; border-bottom: 1px solid #edf0ea; font-size: 12px; font-weight: 820; }
.permission-group-title input, .permission-page input { flex: 0 0 auto; margin-top: 1px; accent-color: #8ebe45; }
.permission-page-list { display: grid; gap: 7px; padding-top: 9px; }
.permission-page { color: #555e50; font-size: 11px; line-height: 1.35; }
.permission-page > span { display: grid; gap: 2px; }
.permission-page small { color: #a16a22; font-size: 9px; }
.permission-page.globally-hidden { opacity: .72; }

.history-result-count { display: inline-flex; align-items: center; min-height: 34px; padding: 0 11px; border: 1px solid #dfe7d7; border-radius: 10px; background: #fff; color: #5d6a55; font-size: 11px; font-weight: 780; }
.history-filter-panel { margin-bottom: 16px; padding: 16px; }
.history-filter-grid { display: grid; grid-template-columns: minmax(210px, 1.7fr) repeat(5, minmax(135px, 1fr)); gap: 10px; align-items: end; }
.history-filter-grid .field { min-width: 0; }
.history-filter-grid input, .history-filter-grid select { width: 100%; min-width: 0; }
.history-filter-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #edf0ea; }
.history-table-panel .table-toolbar { align-items: baseline; }
.history-table-panel .table-toolbar small { color: var(--muted); font-size: 10px; }
.history-table-wrap { max-height: calc(100vh - 390px); min-height: 250px; }
.history-table-wrap thead th { position: sticky; top: 0; z-index: 4; background: #f8faf7; }
.history-table-wrap td { max-width: 340px; vertical-align: top; white-space: normal; overflow-wrap: anywhere; }
.history-table-wrap td > small { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
.history-section-tag { display: inline-flex; padding: 5px 8px; border: 1px solid #dfe9d4; border-radius: 8px; background: #f4f9ed; color: #5c812d; font-size: 10px; font-weight: 780; }
.history-details { display: -webkit-box; overflow: hidden; color: #596052; font-size: 10px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.history-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 14px 4px 2px; }
.history-pagination span { color: var(--muted); font-size: 10px; font-weight: 750; }

@media (max-width: 1280px) {
  .history-filter-grid { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
}
@media (max-width: 760px) {
  .permission-matrix, .history-filter-grid { grid-template-columns: 1fr; }
  .history-filter-actions { justify-content: stretch; }
  .history-filter-actions button { flex: 1; }
}
.entity-card-head .row-action, .integration-head .tag { margin-left: auto; }
.entity-card-head .card-actions { margin-left: auto; }
.danger-text { color: #b74949 !important; }
.entity-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 16px 0; }
.meta-box { background: #f6f8f4; border-radius: 10px; padding: 10px; }
.meta-box small { color: var(--muted); display: block; margin-bottom: 4px; }
.account-list { display: flex; flex-direction: column; gap: 7px; }
.account-line { display: flex; align-items: center; gap: 9px; border-top: 1px solid var(--line); padding-top: 9px; font-size: 12px; }
.account-line .account-schemes { margin-left: auto; color: var(--muted); font-size: 10px; }
.account-line.disabled { opacity: .58; }
.integration-card { min-height: 165px; display: flex; flex-direction: column; }
.integration-body { margin-top: 18px; display: flex; justify-content: space-between; align-items: flex-end; }
.integration-body small { color: var(--muted); max-width: 230px; line-height: 1.5; }
.integration-fbs-status {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  margin-top: 12px;
  padding: 10px 11px;
  border: 1px solid #e1e5de;
  border-radius: 12px;
  background: #fafbf9;
  color: #687062;
}
.integration-fbs-status > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #eef0ec;
}
.integration-fbs-status.enabled {
  border-color: #d5e9b4;
  background: #f9fff1;
  color: #4f791c;
}
.integration-fbs-status.enabled > span { background: #e9f8cf; color: #56891a; }
.integration-fbs-status b { display: block; font-size: 11px; line-height: 1.35; }
.integration-fbs-status small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.35;
}
.integration-fbs-status .row-action { white-space: nowrap; }
.fbs-settings-form { display: grid; gap: 15px; }
.fbs-enable-toggle { justify-self: start; }
.card-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.sync-settings { margin-top: 15px; padding: 11px 12px; display: flex; align-items: center; gap: 10px; border-radius: 11px; background: #f5f7f3; }
.sync-settings select { min-width: 132px; padding: 7px 28px 7px 9px; border: 1px solid var(--line); border-radius: 8px; background: #fff; font: inherit; font-size: 11px; }
.sync-settings > small { margin-left: auto; color: var(--muted); font-size: 10px; }
.sync-settings.readonly > small { margin-left: 0; }
.readonly-setting { display: block; margin-top: 10px; color: var(--muted); font-size: 11px; }
.compact-toggle { display: flex; align-items: center; gap: 7px; cursor: pointer; white-space: nowrap; }
.compact-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.compact-toggle span { position: relative; width: 34px; height: 19px; border-radius: 20px; background: #d5dad2; transition: .2s; }
.compact-toggle span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 13px; height: 13px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.18); transition: .2s; }
.compact-toggle input:checked + span { background: var(--lime-dark); }
.compact-toggle input:checked + span::after { transform: translateX(15px); }
.compact-toggle b { font-size: 11px; }
.compact-toggle:has(input:disabled) { opacity: .55; cursor: default; }
.sync-progress { margin-top: 12px; }
.sync-progress div { display: flex; justify-content: space-between; margin-bottom: 5px; color: var(--muted); font-size: 10px; }
.sync-progress progress { display: block; width: 100%; height: 7px; border: 0; border-radius: 20px; overflow: hidden; }
.sync-progress progress::-webkit-progress-bar { background: #e7ebe4; }
.sync-progress progress::-webkit-progress-value { background: var(--lime-dark); border-radius: 20px; }
.secure-note { display: flex; align-items: flex-start; gap: 9px; padding: 12px; margin: 0; border-radius: 10px; background: #f1f8e8; color: #577244; font-size: 12px; line-height: 1.5; }
.smtp-provider-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px; border: 1px solid #dbe8cf; border-radius: 12px; background: linear-gradient(135deg, #f3faea, #fbfdf8); }
.smtp-provider-banner > div { display: flex; align-items: center; gap: 10px; }
.smtp-provider-banner > div > svg { color: #74a537; }
.smtp-provider-banner span { display: flex; flex-direction: column; gap: 3px; }
.smtp-provider-banner b { font-size: 13px; }
.smtp-provider-banner small { color: var(--muted); font-size: 10px; }
.smtp-yandex-help { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid #e4e8df; border-radius: 11px; background: #fafbf9; }
.smtp-yandex-help > svg { flex: 0 0 auto; color: #799d47; }
.smtp-yandex-help b { font-size: 12px; }
.smtp-yandex-help p { margin: 4px 0 7px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.smtp-yandex-help a { display: inline-flex; align-items: center; gap: 4px; color: #5e8a29; font-size: 10px; font-weight: 750; text-decoration: none; }
.smtp-yandex-help a + a { margin-left: 14px; }
.smtp-yandex-help a:hover { text-decoration: underline; }
.yookassa-webhook-help {
  display: grid;
  gap: 11px;
  padding: 15px;
  border: 1px solid #dbe8cf;
  border-radius: 14px;
  background: linear-gradient(145deg, #f7fced, #fbfdf8);
}
.yookassa-webhook-heading { display: flex; align-items: flex-start; gap: 11px; }
.yookassa-webhook-heading .round-icon {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  color: #5f9218;
  background: #e5f6ce;
}
.yookassa-webhook-heading b { display: block; color: #304a12; font-size: 13px; }
.yookassa-webhook-heading p { margin: 4px 0 0; color: #617057; font-size: 11px; line-height: 1.45; }
.yookassa-webhook-help ol { display: grid; gap: 6px; margin: 0; padding-left: 22px; color: #4f5c48; font-size: 11px; line-height: 1.45; }
.yookassa-webhook-help code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.yookassa-webhook-url {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 7px;
  border: 1px solid #d8e4cb;
  border-radius: 11px;
  background: #fff;
}
.yookassa-webhook-url code {
  min-width: 0;
  padding: 0 5px;
  overflow-wrap: anywhere;
  color: #34422e;
  font-size: 11px;
  line-height: 1.45;
}
.yookassa-webhook-url.is-empty code { color: var(--muted); font-family: inherit; }
.yookassa-webhook-url .ghost-button { height: 34px; padding: 0 11px; font-size: 10px; }
.yookassa-webhook-url .ghost-button:disabled { cursor: default; opacity: .5; }
.yookassa-webhook-docs { display: inline-flex; align-items: center; gap: 5px; justify-self: start; color: #5e8a29; font-size: 11px; font-weight: 750; text-decoration: none; }
.yookassa-webhook-docs:hover { text-decoration: underline; }
.loader-circle { animation: spin .8s linear infinite; }
.user-role { margin-left: auto; }

.system-grid { display: grid; gap: 14px; max-width: 1050px; }
.system-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; min-height: 120px; }
.system-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; color: #5f9218; background: var(--lime-soft); }
.system-copy h2 { margin: 0 0 7px; font-size: 16px; }
.system-copy p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.system-copy code { display: inline-block; margin-top: 9px; padding: 6px 8px; border-radius: 7px; background: #f1f3f0; color: #555c53; font-size: 11px; }
.system-hint { grid-column: 2 / -1; color: #a16c1b; font-size: 11px; }
.switch-button { min-width: 118px; border: 0; background: transparent; cursor: pointer; display: grid; grid-template-columns: 42px auto; align-items: center; gap: 8px; }
.switch-button span { position: relative; width: 42px; height: 23px; border-radius: 20px; background: #d9ddd6; transition: .2s; }
.switch-button span::after { content: ""; position: absolute; left: 3px; top: 3px; width: 17px; height: 17px; border-radius: 50%; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.2); transition: .2s; }
.switch-button.active span { background: var(--lime-dark); }
.switch-button.active span::after { transform: translateX(19px); }
.switch-button b { font-size: 11px; }
.switch-button:disabled { opacity: .55; cursor: not-allowed; }
.paywall { max-width: 620px; margin: 80px auto; padding: 46px; text-align: center; }
.paywall-icon { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 18px; color: #8b3e38; background: #fff0ef; }
.paywall h2 { margin: 0 0 9px; }
.paywall p { margin: 0 auto 22px; max-width: 440px; color: var(--muted); line-height: 1.6; }
.billing-summary { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 14px; align-items: stretch; margin-bottom: 16px; }
.billing-summary > div { min-height: 78px; padding: 13px; border-radius: 11px; background: #f6f8f4; display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.billing-summary small { color: var(--muted); font-size: 10px; }
.billing-summary h2, .billing-summary b { margin: 0; font-size: 18px; }
.billing-current-status .tag { align-self: flex-start; }
.billing-primary-action { align-self: flex-start; min-height: 34px; margin-top: 3px; padding: 0 13px; font-size: 10px; }
.plan-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-bottom: 16px; }
.plan-card { padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 5px 20px rgba(31,42,27,.04); }
.plan-card.current { border-color: #91c94b; box-shadow: 0 0 0 2px rgba(145,201,75,.15); }
.plan-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.plan-head small { color: var(--muted); font-size: 10px; }
.plan-head h2 { margin: 3px 0 0; }
.plan-price { margin: 20px 0 12px; font-size: 28px; font-weight: 900; }
.plan-price small { margin-left: 5px; color: var(--muted); font-size: 11px; font-weight: 500; }
.plan-card > p { min-height: 38px; color: var(--muted); line-height: 1.5; font-size: 12px; }
.plan-card > button { width: 100%; justify-content: center; }
.plan-limit-note { display: block; margin-top: 8px; color: #9b6b24; font-size: 10px; line-height: 1.4; text-align: center; }
.payment-status-cell { min-width: 190px; }
.payment-status-cell small { display: block; max-width: 330px; margin-top: 5px; color: #9d4d42; font-size: 9px; line-height: 1.35; overflow-wrap: anywhere; }
.billing-promo-panel { display: grid; gap: 14px; margin-bottom: 16px; overflow: hidden; }
.billing-promo-heading { display: flex; align-items: center; gap: 12px; min-width: 0; }
.billing-promo-heading > div { min-width: 0; }
.billing-promo-heading h2 { margin: 0 0 4px; font-size: 16px; }
.billing-promo-heading p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.billing-promo-controls { display: grid; grid-template-columns: minmax(190px, 1.5fr) repeat(2, minmax(130px, .7fr)) auto; align-items: end; gap: 11px; min-width: 0; }
.billing-promo-controls > * { min-width: 0; }
.billing-promo-code input { text-transform: uppercase; font-weight: 800; letter-spacing: .06em; }
.billing-promo-actions { display: flex; align-items: center; gap: 7px; min-height: 38px; }
.billing-promo-actions button { min-height: 38px; white-space: nowrap; }
.billing-promo-empty { display: flex; align-items: center; gap: 9px; padding: 11px 12px; border: 1px dashed #d8e3cd; border-radius: 11px; color: var(--muted); background: #fafcf8; font-size: 10px; line-height: 1.45; }
.billing-promo-empty svg { flex: 0 0 auto; color: #79aa35; }
.billing-promo-result { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 11px; padding: 13px; border: 1px solid #cfe3b5; border-radius: 12px; background: linear-gradient(135deg, #fbfff7, #f2fae9); }
.billing-promo-result > .round-icon { background: #dff3c4; color: #5f901f; }
.billing-promo-result-copy { display: grid; min-width: 0; gap: 4px; }
.billing-promo-result b { overflow-wrap: anywhere; }
.billing-promo-result p { margin: 3px 0 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.billing-promo-free { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; }
.billing-promo-free > button { align-self: center; white-space: nowrap; }
.billing-promo-quote { display: grid; grid-template-columns: repeat(5, minmax(105px, 1fr)); gap: 7px; margin-top: 8px; }
.billing-promo-quote > span { display: grid; min-width: 0; gap: 3px; padding: 8px 9px; border-radius: 9px; background: rgba(255,255,255,.85); }
.billing-promo-quote small { color: var(--muted); font-size: 8px; line-height: 1.3; }
.billing-promo-quote b { font-size: 11px; }
.billing-promo-quote .promo-saving b { color: #5f901f; }
.billing-promo-quote .promo-total { background: #e1f3c9; }
.billing-promo-quote .promo-total b { color: #355811; font-size: 13px; }
.billing-columns { display: grid; grid-template-columns: .85fr 1.6fr; gap: 14px; }
.referral-card p { color: var(--muted); line-height: 1.6; }
.referral-code { display: flex; gap: 8px; align-items: center; margin: 18px 0 12px; }
.referral-code code { flex: 1; padding: 11px 13px; border-radius: 9px; background: #f4f6f2; font-weight: 800; letter-spacing: 1px; }
.admin-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin-bottom: 16px; }
.admin-portal-finance { margin-bottom: 16px; scroll-margin-top: 90px; overflow: visible; }
.admin-portal-finance-header { align-items: flex-start; gap: 14px; }
.admin-portal-finance-header > div { display: grid; min-width: 0; gap: 4px; }
.admin-portal-finance-header .eyebrow { margin: 0; color: #6e9e2a; font-size: 9px; }
.admin-portal-finance-header h2 { margin: 0; }
.admin-portal-finance-header small { max-width: 700px; line-height: 1.45; overflow-wrap: anywhere; }
.admin-portal-finance-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 22px; }
.admin-portal-finance-kpis article { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); column-gap: 10px; align-items: center; padding: 13px; border: 1px solid #e4eadf; border-radius: 13px; background: #fafcf8; }
.admin-portal-finance-kpis .round-icon { grid-row: 1 / span 3; width: 34px; height: 34px; }
.admin-portal-finance-kpis small { min-width: 0; color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.admin-portal-finance-kpis b { min-width: 0; margin-top: 3px; font-size: clamp(17px, 1.5vw, 22px); line-height: 1.12; overflow-wrap: anywhere; }
.admin-portal-finance-kpis em { min-width: 0; margin-top: 4px; color: var(--muted); font-size: 9px; font-style: normal; line-height: 1.35; overflow-wrap: anywhere; }
.admin-portal-finance-kpis em.positive { color: #4e982f; }
.admin-portal-finance-kpis em.negative { color: #cf5252; }
.admin-payment-chart-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
.admin-payment-chart-heading > div { display: grid; gap: 3px; }
.admin-payment-chart-heading > div:last-child { text-align: right; }
.admin-payment-chart-heading b { font-size: 13px; }
.admin-payment-chart-heading small { color: var(--muted); font-size: 9px; }
.admin-payment-chart { position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 8px; min-width: 0; padding: 8px 4px 0; border-bottom: 1px solid #dde4d8; background: repeating-linear-gradient(to bottom, transparent 0, transparent 42px, rgba(223, 229, 219, .68) 43px); }
.admin-payment-column { position: relative; display: grid; min-width: 0; grid-template-rows: 20px 174px 25px; gap: 5px; outline: none; }
.admin-payment-bar-value { align-self: end; min-width: 0; overflow: hidden; color: #778071; font-size: 8px; font-weight: 750; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.admin-payment-bar-track { display: flex; min-width: 0; align-items: flex-end; justify-content: center; }
.admin-payment-bar { display: block; width: min(32px, 72%); height: var(--bar-height); min-height: 3px; border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg, #9cdb3f, #72b920); box-shadow: 0 6px 13px rgba(102, 164, 27, .17); transition: filter .16s ease, transform .16s ease; }
.admin-payment-bar.zero { height: 3px; min-height: 3px; background: #dfe5db; box-shadow: none; }
.admin-payment-column.current .admin-payment-bar { background: linear-gradient(180deg, #b9ef59, #5d9f12); }
.admin-payment-column > b { min-width: 0; overflow: hidden; color: #858d80; font-size: 8px; font-weight: 700; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.admin-payment-column:hover .admin-payment-bar,
.admin-payment-column:focus-visible .admin-payment-bar { filter: saturate(1.22) brightness(.96); transform: translateY(-2px); }
.admin-payment-tooltip { position: absolute; z-index: 20; left: 50%; bottom: calc(100% - 22px); display: none; min-width: 190px; padding: 10px 11px; transform: translateX(-50%); border: 1px solid #dfe7d8; border-radius: 11px; background: #fff; box-shadow: 0 14px 35px rgba(31, 45, 25, .17); text-align: left; pointer-events: none; }
.admin-payment-tooltip strong, .admin-payment-tooltip span, .admin-payment-tooltip small { display: block; }
.admin-payment-tooltip strong { margin-bottom: 5px; font-size: 11px; }
.admin-payment-tooltip span { color: #568c13; font-size: 14px; font-weight: 850; }
.admin-payment-tooltip small { margin-top: 4px; color: var(--muted); font-size: 9px; white-space: nowrap; }
.admin-payment-column:hover .admin-payment-tooltip,
.admin-payment-column:focus-visible .admin-payment-tooltip { display: block; }
.admin-payment-column:nth-child(-n+2) .admin-payment-tooltip { left: 0; transform: none; }
.admin-payment-column:nth-last-child(-n+2) .admin-payment-tooltip { right: 0; left: auto; transform: none; }
.admin-payment-zero-note { margin-top: 12px; color: var(--muted); font-size: 10px; text-align: center; }
.admin-payment-empty { min-height: 160px; }
@media (max-width: 1340px) {
  .admin-portal-stats { min-width: 286px; }
  .admin-portal-stat { min-width: 76px; padding-inline: 7px; }
  .admin-portal-stat small { max-width: 70px; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 1120px) {
  .admin-portal-stats { display: none !important; }
  .admin-portal-finance-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .admin-portal-finance-header { flex-direction: column; }
  .admin-portal-finance-kpis { grid-template-columns: 1fr; }
  .admin-payment-chart { gap: 3px; padding-inline: 0; }
  .admin-payment-column { grid-template-rows: 16px 140px 22px; }
  .admin-payment-bar-value { visibility: hidden; }
  .admin-payment-column > b { font-size: 7px; transform: rotate(-38deg); transform-origin: top center; overflow: visible; }
  .admin-payment-tooltip { position: fixed; top: auto; right: 10px !important; bottom: 84px; left: 10px !important; width: auto; min-width: 0; transform: none !important; }
}
.admin-client-toolbar { flex-wrap: wrap; }
.admin-client-toolbar .search { min-width: 210px; }
.admin-client-table { min-width: 1480px; }
.admin-client-table .selection-column { width: 38px !important; min-width: 38px !important; max-width: 38px !important; padding-inline: 8px !important; text-align: center; }
.admin-client-table .selection-column input { width: 16px; height: 16px; margin: 0; accent-color: var(--accent); cursor: pointer; }
.admin-client-table .selection-column input:disabled { cursor: not-allowed; opacity: .45; }
.admin-client-table .selection-column .column-resizer { display: none !important; }
.admin-marketplace-cell { text-align: center; }
.admin-marketplace-status { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 8px; background: #f1f3ef; color: #9aa294; font-size: 15px; font-weight: 900; line-height: 1; }
.admin-marketplace-status.is-connected { background: var(--lime-soft); color: #4f781c; box-shadow: inset 0 0 0 1px rgba(126,174,40,.18); }
.admin-delete-preview { display: grid; gap: 7px; margin: 0; padding: 0 0 0 20px; color: #4e554a; font-size: 12px; }
.admin-delete-preview li { overflow-wrap: anywhere; }
.admin-client-row-actions { display: inline-flex; align-items: center; gap: 4px; }
.admin-client-action { position: relative; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border-radius: 9px; background: #f5f8f2; color: #5d7f2b; }
.admin-client-action:hover, .admin-client-action:focus-visible { background: var(--lime-soft); color: #416c13; }
.admin-client-action::after { content: attr(data-tooltip); position: absolute; z-index: 80; right: 0; bottom: calc(100% + 7px); width: max-content; max-width: 220px; padding: 6px 8px; border-radius: 7px; background: #273124; color: #fff; box-shadow: 0 8px 22px rgba(20,29,17,.2); font-size: 10px; line-height: 1.3; pointer-events: none; opacity: 0; transform: translateY(3px); transition: opacity .12s ease, transform .12s ease; }
.admin-client-action:hover::after, .admin-client-action:focus-visible::after { opacity: 1; transform: translateY(0); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.admin-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(320px, 1fr)); gap: 14px; margin-bottom: 16px; }
.admin-setting-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; }
.admin-setting-card h2 { margin: 0 0 4px; font-size: 15px; }
.admin-setting-card p { margin: 0; color: var(--muted); font-size: 11px; }
.admin-setting-card > :is(button, a) { grid-column: 2 / -1; justify-self: start; }
.admin-promo-panel { margin-bottom: 16px; scroll-margin-top: 90px; }
.admin-promo-heading { display: grid; gap: 3px; margin-right: auto; }
.admin-promo-heading h2 { margin: 0; }
.admin-promo-heading small { color: var(--muted); font-size: 10px; }
.promo-code-cell { display: grid; min-width: 155px; max-width: 250px; gap: 4px; }
.promo-code-cell b, .promo-code-cell small { white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
.promo-code-cell code { justify-self: start; padding: 4px 7px; border-radius: 7px; color: #436b13; background: var(--lime-soft); font-size: 10px; font-weight: 800; letter-spacing: .04em; }
.promo-code-cell small { overflow: hidden; color: var(--muted); font-size: 9px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.promo-row-actions { display: inline-flex; align-items: center; gap: 5px; }
.promo-row-actions .row-action { display: grid; place-items: center; width: 31px; height: 31px; padding: 0; }
.promo-row-actions .row-action.danger { color: #a14842; }
.modal:has(.promo-code-form), .modal:has(.promo-redemption-list) { display: flex; flex-direction: column; width: min(860px, 100%); overflow: hidden; }
.modal:has(.promo-code-form) .modal-body, .modal:has(.promo-redemption-list) .modal-body { min-height: 0; overflow-y: auto; }
.promo-code-form, .promo-redemption-list { display: grid; min-width: 0; gap: 14px; }
.promo-benefit-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.promo-form-section { display: grid; gap: 9px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fafbf9; }
.promo-form-section > div:first-child { display: grid; gap: 3px; }
.promo-form-section b { font-size: 11px; }
.promo-form-section small { color: var(--muted); font-size: 9px; }
.promo-toggle-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.promo-toggle-card { display: flex; align-items: flex-start; gap: 9px; min-width: 0; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; background: #fafbf9; cursor: pointer; }
.promo-toggle-card input { flex: 0 0 auto; width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--lime-dark); }
.promo-toggle-card span { display: grid; min-width: 0; gap: 3px; }
.promo-toggle-card b { font-size: 11px; }
.promo-toggle-card small { color: var(--muted); font-size: 9px; line-height: 1.4; }
#promoMaxActivationsField.is-disabled { opacity: .55; }
.promo-redemption-list .data-table-wrap { max-height: min(54vh, 520px); }
.danger-note { display: flex; align-items: flex-start; gap: 10px; padding: 13px; border: 1px solid #efcbc7; border-radius: 12px; color: #7f3833; background: #fff4f2; }
.danger-note > svg { flex: 0 0 auto; }
.danger-note b { font-size: 12px; }
.danger-note p { margin: 4px 0 0; font-size: 10px; line-height: 1.45; }
.modal:has(.backup-management) { width: min(820px, 100%); }
.modal:has(.backup-management) .modal-body { min-height: 0; overflow-y: auto; }
.backup-management { display: grid; gap: 14px; min-width: 0; }
.backup-enabled-option { display: flex; align-items: flex-start; gap: 10px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 11px; background: #f8faf6; cursor: pointer; }
.backup-enabled-option input { flex: 0 0 auto; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--lime-dark); }
.backup-enabled-option span { display: grid; gap: 3px; }
.backup-enabled-option b { font-size: 12px; }
.backup-enabled-option small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.backup-schedule-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.backup-schedule-grid .field:last-child { grid-column: 1 / -1; }
.backup-runtime { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 13px; border: 1px solid #dbe8cc; border-radius: 12px; background: #f7fbf2; }
.backup-runtime > span, .backup-file-icon { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 10px; background: var(--lime-soft); color: #61911f; }
.backup-runtime > div { display: grid; min-width: 0; gap: 4px; }
.backup-runtime b { font-size: 12px; }
.backup-runtime small { color: var(--muted); font-size: 10px; line-height: 1.4; overflow-wrap: anywhere; }
.backup-runtime.has-error { border-color: #efd0c8; background: #fff8f5; }
.backup-runtime.has-error > span { background: #fbe7e2; color: #a04e3f; }
.backup-list-section { display: grid; gap: 8px; min-width: 0; }
.backup-list-section .panel-header { margin: 0; }
.backup-list-section h3 { margin: 0; font-size: 13px; }
.backup-list { display: grid; max-height: 270px; overflow-y: auto; border: 1px solid var(--line); border-radius: 12px; }
.backup-list-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 10px; min-width: 0; padding: 11px 12px; background: #fff; }
.backup-list-row + .backup-list-row { border-top: 1px solid var(--line); }
.backup-list-row > div { display: grid; min-width: 0; gap: 3px; }
.backup-list-row b { font-size: 11px; }
.backup-list-row small { color: var(--muted); font-size: 9px; }
.backup-list-row code { overflow: hidden; color: #747b70; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.backup-list-row .ghost-button { min-height: 32px; padding: 0 10px; font-size: 10px; text-decoration: none; }
.backup-list-row .row-action { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; }
.backup-key-warning { display: flex; align-items: flex-start; gap: 9px; padding: 11px 12px; border: 1px solid #ecdca9; border-radius: 11px; background: #fffbea; color: #786827; font-size: 10px; line-height: 1.5; }
.backup-key-warning > svg { flex: 0 0 auto; margin-top: 1px; }
.backup-restore-section { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 13px; border: 1px solid #ecdca9; border-radius: 12px; background: #fffdf5; }
.backup-restore-section h3 { margin: 0 0 4px; font-size: 13px; }
.backup-restore-section p, .backup-restore-modal .modal-help { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.backup-restore-section .danger-button { white-space: nowrap; }
.backup-restore-modal { display: grid; gap: 13px; }
.backup-restore-ready { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 9px; min-width: 0; }
.backup-restore-ready .backup-key-warning { flex: 1 1 280px; }
.server-restart-progress { width: min(430px, calc(100vw - 28px)); }
.server-restart-progress .modal-body { display: grid; justify-items: center; gap: 10px; padding: 30px 24px; text-align: center; }
.server-restart-progress h2, .server-restart-progress p { margin: 0; }
.server-restart-progress p { max-width: 340px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.server-restart-spinner { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--lime-soft); color: #61911f; }
.server-restart-spinner svg { animation: spin 1s linear infinite; }
.admin-visibility-note { display: flex; align-items: flex-start; gap: 11px; padding: 13px 14px; border: 1px solid #dce7cf; border-radius: 12px; background: var(--lime-soft); color: #496c1d; }
.admin-visibility-note > svg { flex: 0 0 auto; margin-top: 1px; }
.admin-visibility-note b { color: #304a12; font-size: 12px; }
.admin-visibility-note p { margin: 3px 0 0; font-size: 10px; line-height: 1.5; }
.portal-visibility-groups { display: grid; gap: 12px; margin-top: 14px; }
.portal-visibility-group { padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fafbf9; }
.portal-visibility-group h3 { margin: 0 0 9px; font-size: 12px; }
.portal-visibility-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.portal-visibility-option { display: flex; align-items: flex-start; gap: 9px; min-width: 0; padding: 10px; border: 1px solid #e5e9e1; border-radius: 10px; background: #fff; cursor: pointer; }
.portal-visibility-option:hover { border-color: #cbdcaf; background: #fbfef7; }
.portal-visibility-option input, .release-publication-row input { flex: 0 0 auto; width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--lime-dark); }
.portal-visibility-option span { display: grid; min-width: 0; gap: 3px; }
.portal-visibility-option b { font-size: 11px; }
.portal-visibility-option small { color: var(--muted); font-size: 9px; line-height: 1.35; }
.portal-visibility-option.is-protected { cursor: not-allowed; background: #f4f6f2; opacity: .78; }
.release-publication-list { display: grid; gap: 8px; max-height: min(54vh, 560px); margin-top: 14px; overflow-y: auto; padding-right: 3px; }
.release-publication-row { display: flex; align-items: flex-start; gap: 10px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; background: #fff; cursor: pointer; }
.release-publication-row:hover { border-color: #cbdcaf; background: #fbfef7; }
.release-publication-copy { display: grid; min-width: 0; flex: 1; gap: 4px; }
.release-publication-copy > span { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.release-publication-copy b { color: #628f20; font-size: 10px; }
.release-publication-copy time { color: var(--muted); font-size: 9px; }
.release-publication-copy strong { overflow-wrap: anywhere; font-size: 11px; line-height: 1.35; }
.release-publication-copy small { color: var(--muted); font-size: 9px; }
.cell-note { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
.admin-subscription-head { display: flex; align-items: center; gap: 10px; padding: 13px; border-radius: 11px; background: #f5f7f3; }
.admin-subscription-head small { margin-left: auto; color: var(--muted); }
.admin-member-list { display: flex; flex-direction: column; gap: 6px; padding: 12px 0; border-top: 1px solid var(--line); }
.admin-member-list > b { margin-bottom: 3px; font-size: 13px; }
.admin-member-list > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 10px; border-radius: 9px; background: #f7f8f6; }
.admin-member-list span { display: flex; flex-direction: column; gap: 3px; }
.admin-member-list strong { font-size: 12px; }
.admin-member-list small { color: var(--muted); font-size: 10px; }
.admin-modal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-top: 6px; border-top: 1px solid var(--line); }
.admin-modal-actions button:last-child { grid-column: 1 / -1; }

.compare-period-block { display: flex; flex-direction: column; gap: 10px; padding: 13px; border: 1px solid var(--line); border-radius: 12px; }
.compare-period-block > b { font-size: 13px; }
.comparison-caption { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; color: var(--muted); font-size: 11px; }
.comparison-caption span { padding: 9px 11px; border-radius: 9px; background: #f4f6f2; text-align: center; }
.comparison-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.comparison-grid article { display: grid; grid-template-columns: 1fr auto; gap: 5px 10px; padding: 13px; border: 1px solid var(--line); border-radius: 11px; }
.comparison-grid small, .comparison-grid em { color: var(--muted); font-size: 10px; font-style: normal; }
.comparison-grid b { font-size: 16px; }
.comparison-grid span { grid-row: 1 / 3; grid-column: 2; align-self: center; font-weight: 800; font-size: 12px; }

.danger-notice { display: flex; align-items: flex-start; gap: 11px; padding: 13px; border: 1px solid #f1c1c1; border-radius: 11px; background: #fff5f5; color: #7f3030; }
.danger-notice > i { flex: 0 0 auto; margin-top: 1px; }
.danger-notice b { font-size: 13px; }
.danger-notice p { margin: 5px 0 0; color: #9a5353; font-size: 11px; line-height: 1.5; }

.column-drawer-backdrop { position: fixed; inset: 0; z-index: 110; background: rgba(18,22,17,.35); }
.column-drawer { position: absolute; top: 0; right: 0; width: min(470px, 100%); height: 100%; display: flex; flex-direction: column; background: #fff; box-shadow: -20px 0 50px rgba(20,26,18,.14); }
.column-drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.column-drawer-head h2 { margin: 0; font-size: 18px; }
.column-drawer > p { margin: 0; padding: 18px 22px 12px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.column-list { flex: 1; min-height: 0; overflow-y: auto; padding: 5px 14px 15px; }
.column-list-item { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; min-height: 48px; padding: 0 9px; border-bottom: 1px solid #f0f2ee; cursor: grab; }
.column-list-item:active { cursor: grabbing; }
.column-list-item.dragging { opacity: .35; background: #f2f9e8; }
.column-list-item input { width: 18px; height: 18px; accent-color: #8acb3d; }
.column-list-item span { font-size: 13px; font-weight: 700; }
.column-list-item > i { color: #a4aaa0; }
.column-drawer-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 16px 20px; border-top: 1px solid var(--line); }
.column-drawer-actions button { justify-content: center; }

.release-notes-backdrop { position: fixed; inset: 0; z-index: 150; background: rgba(18,22,17,.24); animation: releaseNotesBackdropIn .18s ease-out; }
.release-notes-open { overflow: hidden; }
.release-notes-open .main, .release-notes-open .sidebar { overflow: hidden; }
.release-notes-drawer { position: absolute; top: 0; right: 0; width: min(450px, calc(100vw - 24px)); height: 100%; display: flex; flex-direction: column; background: #f7f9f5; box-shadow: -22px 0 60px rgba(20,30,17,.2); animation: releaseNotesDrawerIn .22s cubic-bezier(.22,.8,.25,1); }
.release-notes-backdrop.is-closing { animation: releaseNotesBackdropOut .19s ease forwards; }
.release-notes-backdrop.is-closing .release-notes-drawer { animation: releaseNotesDrawerOut .19s ease forwards; }
.release-notes-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex: 0 0 auto; padding: 20px 22px; border-bottom: 1px solid var(--line); background: #fff; }
.release-notes-heading { display: flex; align-items: center; gap: 12px; min-width: 0; }
.release-notes-heading > div { min-width: 0; }
.release-notes-heading h2 { margin: 0; font-size: 20px; letter-spacing: -.35px; }
.release-notes-heading p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.release-notes-icon { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 13px; background: var(--lime-soft); color: #5b8d16; }
.release-notes-close { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 11px; background: #f0f3ed; color: #6f756c; cursor: pointer; }
.release-notes-close:hover, .release-notes-close:focus-visible { background: #e8ede4; color: var(--text); outline: 2px solid rgba(143,198,45,.28); outline-offset: 1px; }
.release-notes-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px; }
.release-note { position: relative; padding: 17px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: 0 8px 24px rgba(33,43,29,.045); }
.release-note + .release-note { margin-top: 13px; }
.release-note.latest { border-color: #cce99e; box-shadow: 0 10px 30px rgba(118,158,52,.09); }
.release-note.latest::before { content: ""; position: absolute; top: 17px; bottom: 17px; left: 0; width: 3px; border-radius: 0 4px 4px 0; background: var(--lime-dark); }
.release-note-meta { display: flex; align-items: center; gap: 7px; min-height: 24px; }
.release-note-meta time { margin-left: auto; color: var(--muted); font-size: 10px; }
.release-note-version, .release-note-new { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border-radius: 7px; font-size: 10px; font-weight: 800; }
.release-note-version { background: #eff3eb; color: #535b4e; }
.release-note-new { background: var(--lime); color: #34451e; }
.release-note h3 { margin: 14px 0 7px; font-size: 16px; line-height: 1.3; }
.release-note > p { margin: 0 0 13px; color: #687064; font-size: 12px; line-height: 1.55; }
.release-note ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.release-note li { display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: start; gap: 9px; color: #42483f; font-size: 12px; line-height: 1.48; }
.release-note li > span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 7px; background: var(--lime-soft); color: #5b8d16; }
.release-note li > div { padding-top: 2px; overflow-wrap: anywhere; }
.release-notes-empty { display: grid; justify-items: center; gap: 9px; padding: 52px 24px; border: 1px dashed #dce2d7; border-radius: 16px; background: #fff; color: var(--muted); text-align: center; }
.release-notes-empty h3 { margin: 5px 0 0; color: var(--text); font-size: 15px; }
.release-notes-empty p { max-width: 290px; margin: 0; font-size: 11px; line-height: 1.5; }
.release-notes-footer { display: flex; align-items: center; justify-content: center; gap: 7px; flex: 0 0 auto; padding: 13px 18px; border-top: 1px solid var(--line); background: #fff; color: #737b6e; font-size: 10px; }
@keyframes releaseNotesBackdropIn { from { opacity: 0; } }
@keyframes releaseNotesDrawerIn { from { transform: translateX(100%); } }
@keyframes releaseNotesBackdropOut { to { opacity: 0; } }
@keyframes releaseNotesDrawerOut { to { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) {
  .release-notes-backdrop, .release-notes-drawer,
  .release-notes-backdrop.is-closing, .release-notes-backdrop.is-closing .release-notes-drawer { animation: none; }
}

.section-heading { margin: 42px 0 15px; font-size: 21px; letter-spacing: -.4px; }
.round-icon { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; background: #f1f3f0; font-size: 19px; }
.finance-metrics { display: grid; grid-template-columns: repeat(4, minmax(210px, 1fr)); gap: 14px; }
.finance-metric { display: flex; align-items: center; gap: 14px; min-height: 86px; padding: 16px 18px; background: #fff; border: 1px solid #eef0ec; border-radius: 13px; box-shadow: 0 8px 20px rgba(37,46,33,.04); }
.finance-metric div { display: flex; flex-direction: column; gap: 4px; }
.finance-metric small { color: var(--muted); font-size: 12px; }
.finance-metric b { font-size: 17px; }
.finance-metric strong { margin-left: auto; color: #666c64; font-size: 14px; }
.finance-metric .round-icon,
.finance-summary-card .round-icon {
  background: var(--lime-soft);
  color: #5f8f18;
}
.finance-metric:hover .round-icon,
.finance-summary-card .summary-line:hover .round-icon {
  background: #dff5b8;
  color: #4f7f12;
}
.finance-details { display: grid; grid-template-columns: 1fr 1.35fr 1.15fr; gap: 14px; align-items: stretch; }
.finance-summary-card, .expense-structure-card, .logistics-donut-card { min-height: 355px; }
.summary-line { display: flex; align-items: center; gap: 12px; padding: 8px 0; }
.summary-line .round-icon { width: 38px; height: 38px; font-size: 16px; }
.summary-line div { display: flex; flex-direction: column; gap: 3px; }
.summary-line small { color: var(--muted); font-size: 11px; }
.summary-line b { font-size: 13px; }
.summary-line strong { margin-left: auto; font-size: 12px; color: #5b6059; }
.expense-total { display: flex; justify-content: space-between; margin-bottom: 14px; }
.expense-total div { display: flex; flex-direction: column; gap: 4px; }
.expense-total div:last-child { text-align: right; }
.expense-total small { color: var(--muted); font-size: 11px; }
.stacked-bar { display: flex; height: 30px; overflow: hidden; border-radius: 7px; background: #eceeeb; margin-bottom: 15px; }
.stacked-bar span { min-width: 2px; }
.expense-legend { display: flex; flex-direction: column; gap: 11px; }
.expense-legend div { display: grid; grid-template-columns: 9px 1fr auto 44px; align-items: center; gap: 9px; font-size: 12px; }
.expense-legend i, .donut-caption i, .status-legend i { width: 8px; height: 8px; border-radius: 50%; }
.expense-legend small { color: var(--muted); text-align: right; }
.logistics-donut-card { display: flex; flex-direction: column; }
.logistics-stack { height: 22px; margin-top: 2px; }
.logistics-legend { gap: 9px; }
.logistics-legend div { grid-template-columns: 9px minmax(0, 1fr) auto 42px; font-size: 11px; }
.logistics-legend span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.donut { --value: 50; width: 185px; height: 185px; margin: 6px auto 18px; border-radius: 50%; display: grid; place-items: center; background: var(--donut-bg, conic-gradient(#88d9b2 calc(var(--value) * 1%), #ffdfa0 0)); position: relative; }
.donut::before { content: ""; position: absolute; inset: 16px; border-radius: 50%; background: #fff; }
.donut div { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.donut small { color: var(--muted); }
.donut-caption { display: flex; justify-content: center; flex-wrap: wrap; gap: 13px; font-size: 10px; color: var(--muted); }
.donut-caption span { display: flex; align-items: center; gap: 6px; }

.balance-metrics { grid-template-columns: repeat(5, minmax(180px, 1fr)); margin-bottom: 16px; }
.balance-metric > div { min-width: 0; }
.balance-metric em { color: var(--muted); font-size: 10px; font-style: normal; line-height: 1.35; }
.balance-filter-notice {
  flex: 0 1 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  max-width: 460px;
  padding: 7px 10px;
  border: 1px solid #efdda6;
  border-radius: 10px;
  background: #fff9e9;
  color: #725816;
}
.balance-filter-notice > svg { flex: 0 0 auto; }
.balance-filter-notice > div { min-width: 0; display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 6px; }
.balance-filter-notice b { flex: 0 0 auto; font-size: 10px; }
.balance-filter-notice span { min-width: 0; font-size: 9px; line-height: 1.35; }
.balance-forecast-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 16px;
  padding: 12px 14px;
  border: 1px solid #dcebbf;
  border-radius: 13px;
  background: #f5faec;
  color: #4f682b;
}
.balance-forecast-notice > svg { flex: 0 0 auto; margin-top: 1px; color: #6e9e28; }
.balance-forecast-notice > div { display: grid; gap: 3px; }
.balance-forecast-notice b { color: #3f5424; font-size: 12px; }
.balance-forecast-notice span { font-size: 11px; line-height: 1.45; }
.payout-month-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.payout-month-card { min-width: 0; }
.payout-month-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.payout-month-head > div { min-width: 0; }
.payout-month-head small { display: block; margin-bottom: 4px; color: var(--muted); font-size: 10px; }
.payout-month-head h2 { margin: 0; font-size: 16px; }
.payout-month-head > strong { flex: 0 0 auto; color: #4f7f12; font-size: 19px; }
.payout-nearest-list { display: grid; gap: 7px; }
.payout-nearest-row {
  display: grid;
  grid-template-columns: 27px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 9px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid #edf1e8;
  border-radius: 11px;
  background: #fbfcfa;
}
.payout-nearest-row > span { min-width: 0; display: grid; gap: 3px; }
.payout-nearest-row > span b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.payout-nearest-row > span small { color: var(--muted); font-size: 10px; }
.payout-nearest-row > strong { white-space: nowrap; font-size: 12px; }
.payout-nearest-row > em { font-style: normal; white-space: nowrap; }
.payout-card-more { margin-top: 10px; color: var(--muted); font-size: 10px; text-align: right; }
.payout-month-empty { min-height: 92px; display: flex; align-items: center; justify-content: center; gap: 10px; border: 1px dashed #dce2d7; border-radius: 12px; color: #76806f; background: #fafbf9; }
.payout-month-empty > svg { color: #78ad30; }
.payout-month-empty > span { display: grid; gap: 4px; }
.payout-month-empty b { color: var(--text); font-size: 12px; }
.payout-month-empty small { color: var(--muted); font-size: 10px; }
.balances-overview-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(310px, .75fr); align-items: stretch; gap: 14px; margin-bottom: 16px; }
.balance-history-panel, .balance-market-card { min-width: 0; }
.balance-history-panel .panel-header { align-items: flex-start; gap: 16px; }
.balance-history-panel .panel-header > div:first-child { display: grid; gap: 4px; min-width: 0; }
.balance-history-panel .panel-header small, .balance-market-card .panel-header small { font-size: 10px; }
.balance-history-header-controls { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.balance-history-period-control {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 0 9px;
  border: 1px solid #dfe4dc;
  border-radius: 10px;
  background: #fff;
  color: #66705f;
}
.balance-history-period-control > svg { flex: 0 0 auto; color: #6f9e2e; }
.balance-history-period-control > span { color: var(--muted); font-size: 10px; font-weight: 700; }
.balance-history-period-control select { min-width: 122px; padding: 0 20px 0 0; border: 0; outline: 0; background: transparent; color: var(--text); font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.balance-history-period-control:focus-within { border-color: #a8ce70; box-shadow: 0 0 0 3px rgba(139, 190, 60, .12); }
.balance-history-group-tabs { flex: 0 0 auto; }
.balance-history-account-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin: -2px 0 13px; padding-bottom: 13px; border-bottom: 1px solid #edf1e8; }
.balance-history-account-toggle,
.balance-history-show-all {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 31px;
  padding: 0 10px;
  border: 1px solid #e1e6dc;
  border-radius: 9px;
  background: #f7f9f5;
  color: #72796e;
  font: inherit;
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
}
.balance-history-account-toggle i { width: 9px; height: 9px; border-radius: 50%; background: var(--series-color); opacity: .3; }
.balance-history-account-toggle.active { border-color: #cfdfa9; background: #f2f9e8; color: #35412f; }
.balance-history-account-toggle.active i { opacity: 1; box-shadow: 0 0 0 3px color-mix(in srgb, var(--series-color) 17%, transparent); }
.balance-history-account-toggle:hover, .balance-history-show-all:hover { border-color: #bcd98d; color: #4c6e23; }
.balance-history-show-all { margin-left: auto; background: #fff; color: #5b8527; }
.balance-history-show-all svg { width: 14px; height: 14px; }
.balance-history-chart-wrap { min-height: 348px; overflow-x: auto; overflow-y: hidden; }
.balance-history-chart-box { display: flex; flex-direction: column; width: var(--balance-chart-width, 100%); min-width: 100%; min-height: 340px; }
.balance-history-chart-box svg { display: block; flex: 1; width: 100%; min-height: 315px; overflow: visible; }
.balance-history-line { fill: none; stroke: var(--series-color); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 4px 5px color-mix(in srgb, var(--series-color) 16%, transparent)); }
.balance-history-hit { fill: transparent; pointer-events: all; }
.balance-history-point { fill: #fff; stroke: var(--series-color); stroke-width: 3; pointer-events: none; transition: r .12s ease, fill .12s ease; }
.balance-history-point-wrap:hover .balance-history-point { r: 5.7; fill: var(--series-color); }
.balance-history-tooltip { display: none; pointer-events: none; }
.balance-history-point-wrap:hover .balance-history-tooltip { display: block; }
.balance-history-tooltip rect { fill: #fff; stroke: #e4eddb; filter: url(#balanceHistoryTooltipShadow); }
.balance-history-tooltip-account { fill: #687160; font-size: 9px; }
.balance-history-tooltip-change { fill: #7d8775; font-size: 9px; }
.balance-history-tooltip-change.positive { fill: #4f8b25; }
.balance-history-tooltip-change.negative { fill: #bb5a4c; }
.balance-history-caption { min-height: 25px; padding: 3px 8px 0; color: var(--muted); font-size: 10px; text-align: right; }
.balance-chart-empty { min-height: 285px; display: grid; place-content: center; justify-items: center; gap: 7px; padding: 30px; color: var(--muted); text-align: center; }
.balance-chart-empty > span { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--lime-soft); color: #608e21; }
.balance-chart-empty b { color: var(--text); font-size: 14px; }
.balance-chart-empty small { max-width: 410px; font-size: 11px; line-height: 1.5; }
.balance-market-card .market-list { max-height: 365px; overflow: auto; padding-right: 3px; }
.balance-market-card .market-account-list { margin-left: 0; }
.balance-market-card .market-account-head b { font-size: 11px; }
.compact-empty { padding: 34px 12px; }
.balance-accounts-table { margin-bottom: 16px; }
.balance-accounts-table .data-table-wrap { max-height: min(56vh, 520px); }
.balance-accounts-table .market-icon { display: inline-grid; margin-right: 7px; vertical-align: middle; }
.balance-market-name { vertical-align: middle; }
.balance-status { display: inline-flex; align-items: center; min-height: 25px; padding: 0 8px; border-radius: 8px; font-size: 10px; font-weight: 800; white-space: nowrap; }
.balance-status.success { background: #eaf7df; color: #468b27; }
.balance-status.warning { background: #fff4da; color: #9a6919; }
.balance-status.error { background: #ffebeb; color: #bd4949; }
.balance-status.muted { background: #eef0ec; color: #747a71; }
.balance-source { display: block; max-width: 210px; margin-top: 4px; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
#refreshBalances.is-loading svg { animation: spin .8s linear infinite; }

.unit-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; min-width: 0; margin: 0 0 16px; }
.unit-metrics > div {
  position: relative;
  min-width: 0;
  min-height: 112px;
  padding: 16px 16px 14px 70px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 8px 22px rgba(31, 43, 25, .04);
}
.unit-metrics > div:hover { border-color: #cfe8a7; box-shadow: 0 10px 26px rgba(93, 138, 34, .08); }
.unit-metrics .round-icon { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); background: var(--lime-soft); color: #5f8f18; }
.unit-metrics small,
.unit-metrics b,
.unit-metrics strong,
.unit-metrics em {
  grid-column: 1;
  min-width: 0;
  max-width: 100%;
}
.unit-metrics small { color: var(--muted); font-size: 11px; margin-bottom: 5px; }
.unit-metrics b {
  display: block;
  font-size: clamp(13px, 1vw, 18px);
  line-height: 1.2;
  letter-spacing: -.25px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-variant-numeric: tabular-nums;
}
.unit-metrics strong {
  display: block;
  margin-top: 4px;
  color: #777c75;
  font-size: 12px;
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
}
.unit-metrics em { color: #65715d; font-style: normal; font-size: 13px; font-weight: 750; line-height: 1.25; margin-top: 5px; white-space: normal; overflow-wrap: anywhere; }
.view-bar { display: flex; align-items: center; gap: 18px; margin: 0 0 12px; }
.view-tabs { display: inline-flex; align-items: center; gap: 6px; }
.view-tabs button { height: 38px; padding: 0 13px; border: 0; background: transparent; color: #b0b4ae; font-weight: 750; cursor: pointer; border-radius: 10px; }
.view-tabs button.active { color: var(--text); background: #fff; box-shadow: inset 0 0 0 1.5px #9da39a; }
.view-tabs.compact button { color: var(--text); background: #f0f2ef; font-size: 12px; }
.view-tabs.compact button.active { background: #fff; }
.unit-table .data-table { min-width: 100%; }
.unit-table .data-table-wrap { max-height: min(68vh, calc(100vh - 315px)); overflow: auto; }
.unit-table .data-table th { top: 0; z-index: 6; box-shadow: 0 1px 0 #dfe3dc; }
.unit-table td:first-child { min-width: 360px; white-space: normal; }
.unit-table td:first-child.column-user-sized,
.unit-table th:first-child.column-user-sized,
.dashboard-products-table td:first-child.column-user-sized,
.dashboard-products-table th:first-child.column-user-sized,
.cost-table td:first-child.column-user-sized,
.cost-table th:first-child.column-user-sized { min-width: 130px; }
.data-table td.column-user-sized .product-cell { min-width: 0; max-width: 100%; width: 100%; }
.unit-table .product-cell { align-items: flex-start; min-width: 0; }
.unit-table .product-cell > div { min-width: 0; flex: 1; }
.unit-table .product-cell b,
.unit-table .product-cell small,
.unit-table .product-cell em { display: block; white-space: normal; overflow-wrap: anywhere; word-break: break-word; line-height: 1.38; }
.dashboard-products-table { min-width: 1120px; }
.dashboard-products-table-wrap {
  max-height: min(68vh, 620px);
  overflow: auto;
  overscroll-behavior: contain;
}
.dashboard-products-table-wrap .dashboard-products-table th {
  top: 0;
  z-index: 6;
  box-shadow: 0 1px 0 #dfe3dc;
}
.dashboard-products-table td:first-child { min-width: 360px; white-space: normal; }
.dashboard-products-table .product-cell { align-items: flex-start; min-width: 0; }
.dashboard-products-table .product-cell > div { min-width: 0; flex: 1; }
.dashboard-products-table .product-cell b,
.dashboard-products-table .product-cell small,
.dashboard-products-table .product-cell em { display: block; white-space: normal; overflow-wrap: anywhere; word-break: break-word; line-height: 1.38; }
.unit-view-bar { align-items: center; flex-wrap: wrap; }
.unit-expense-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.unit-zero-filter { min-height: 38px; }
.unit-no-base { color: var(--muted); font-weight: 700; cursor: help; }
.unit-filter-tools { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.unit-product-filter { position: relative; flex: 1 1 340px; min-width: 280px; max-width: 620px; }
.unit-product-control {
  min-height: 40px;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 5px;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}
.unit-product-control:focus-within { border-color: #9dcd4d; box-shadow: 0 0 0 2px rgba(185,239,89,.25); }
.unit-product-search {
  flex: 1 1 90px;
  min-width: 80px;
  height: 28px;
  padding: 0 4px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 12px;
}
.unit-product-search::placeholder { color: #9ba297; }
.unit-product-count {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid #d7e9bd;
  border-radius: 8px;
  background: #f0f8e5;
  color: #426b17;
  font-size: 11px;
  white-space: nowrap;
}
.unit-product-count b { font-size: 12px; }
.unit-product-clear,
.unit-product-apply {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #64833d;
  cursor: pointer;
  font: inherit;
  font-size: 16px;
}
.unit-product-clear:hover,
.unit-product-apply:hover { background: #dfeecb; color: #31580d; }
.unit-product-apply { background: var(--lime-soft); color: #4f7d16; }
.unit-product-apply:disabled { background: transparent; color: #aab0a5; cursor: default; opacity: .65; }
.unit-product-options {
  position: absolute;
  z-index: 155;
  top: calc(100% + 6px);
  left: 0;
  width: max(100%, 430px);
  max-width: min(620px, calc(100vw - 32px));
  max-height: 330px;
  overflow-y: auto;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 20px 52px rgba(24, 32, 21, .18);
}
.unit-product-options-head {
  position: sticky;
  z-index: 2;
  top: -7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: -7px -7px 5px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.unit-product-options-head button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border: 0;
  border-radius: 8px;
  background: #eef7e2;
  color: #4f7b19;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}
.unit-product-options-head button:hover { background: #e2f0cf; color: #365f0d; }
.unit-product-options-head small { color: var(--muted); font-size: 10px; white-space: nowrap; }
.unit-product-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 10px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}
.unit-product-option:hover,
.unit-product-option:focus-visible,
.unit-product-option:has(input:focus-visible) { outline: 0; background: #f1f7e9; }
.unit-product-option > input {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--lime-dark);
  cursor: pointer;
}
.unit-product-option > span:last-child { min-width: 0; display: grid; gap: 3px; }
.unit-product-option b,
.unit-product-option small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.unit-product-option b { font-size: 12px; }
.unit-product-option small { color: var(--muted); font-size: 10px; }
.unit-product-empty { padding: 18px 12px; color: var(--muted); text-align: center; font-size: 11px; }
.unit-filter-tools label { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.unit-filter-tools select { min-height: 38px; border: 1px solid var(--line); border-radius: 10px; background: #fff; padding: 0 32px 0 10px; color: var(--text); font: inherit; font-size: 12px; }
.unit-filter-tools select:focus { border-color: #9dcd4d; outline: none; box-shadow: 0 0 0 2px rgba(185,239,89,.25); }
.unit-sort-controls { margin-left: auto; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.unit-sort-controls label { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.unit-sort-controls select { min-height: 36px; border: 1px solid var(--line); border-radius: 11px; background: #fff; padding: 0 34px 0 12px; color: var(--text); font: inherit; }
.unit-chart-details { grid-template-columns: 1fr 1fr 1fr; }
.unit-performance-chart { margin-bottom: 16px; overflow: hidden; }
.unit-performance-chart .panel-header { align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.unit-chart-series-controls { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; min-width: 0; margin-left: auto; }
.unit-chart-series-toggle,
.unit-chart-series-reset { display: inline-flex; align-items: center; gap: 6px; min-height: 31px; padding: 0 10px; border: 1px solid #dfe6d9; border-radius: 9px; background: #f8faf6; color: #7a8374; font: inherit; font-size: 11px; font-weight: 750; line-height: 1; white-space: nowrap; cursor: pointer; transition: border-color .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease, opacity .15s ease; }
.unit-chart-series-toggle:hover,
.unit-chart-series-reset:hover { border-color: #badb84; background: #f1f9e5; color: #527d1c; }
.unit-chart-series-toggle:focus-visible,
.unit-chart-series-reset:focus-visible { border-color: var(--lime-dark); outline: 2px solid rgba(143,198,45,.24); outline-offset: 1px; }
.unit-chart-series-toggle.active { border-color: #c9e69c; background: var(--lime-soft); color: #4e781a; box-shadow: inset 0 0 0 1px rgba(143,198,45,.08); }
.unit-chart-series-toggle:not(.active) { opacity: .68; }
.unit-chart-series-swatch { width: 10px; height: 10px; flex: 0 0 auto; border-radius: 3px; background: var(--series-color); box-shadow: 0 0 0 1px rgba(45,53,38,.08); transition: opacity .15s ease, filter .15s ease; }
.unit-chart-series-toggle:not(.active) .unit-chart-series-swatch { opacity: .3; filter: grayscale(1); }
.unit-chart-series-reset { border-style: dashed; background: #fff; color: #60852f; }
.unit-chart-series-reset svg { width: 13px; height: 13px; }
.unit-chart-empty { min-height: 250px; display: grid; place-content: center; justify-items: center; gap: 7px; padding: 28px; color: var(--muted); text-align: center; }
.unit-chart-empty b { color: var(--text); font-size: 14px; }
.unit-chart-empty span { max-width: 420px; font-size: 12px; line-height: 1.5; }
.unit-chart-scroll { width: 100%; overflow-x: auto; overflow-y: hidden; padding-bottom: 4px; }
.unit-performance-chart .unit-chart-scroll svg { width: var(--chart-width); max-width: none; min-height: 330px; display: block; }
.unit-performance-chart .chart-zero-line { stroke: #aeb5aa; stroke-width: 1.3; stroke-dasharray: 5 5; }
.unit-performance-chart .chart-hit { fill: transparent; pointer-events: all; }
.unit-performance-chart .chart-focus-line { stroke: #cfe3b5; stroke-width: 1.2; stroke-dasharray: 4 5; opacity: 0; transition: opacity .12s ease; }
.unit-performance-chart .chart-day-tooltip { display: none; pointer-events: none; }
.unit-performance-chart .chart-day-tooltip rect { fill: #fff; stroke: #e4eddb; filter: url(#unitTooltipShadow); }
.unit-performance-chart .chart-tooltip-title { fill: #2d3526; font-size: 12px; font-weight: 800; }
.unit-performance-chart .chart-tooltip-label { fill: #7d8775; font-size: 11px; }
.unit-performance-chart .chart-tooltip-value { fill: #2d3526; font-size: 11px; font-weight: 800; }
.unit-performance-chart .chart-day:hover .chart-focus-line { opacity: 1; }
.unit-performance-chart .chart-day:hover .chart-day-tooltip { display: block; }
.unit-performance-chart .chart-bar-main,
.unit-performance-chart .chart-bar-muted,
.unit-performance-chart .chart-bar-return { transition: filter .12s ease, opacity .12s ease; }
.unit-performance-chart svg:has(.chart-day:hover) .chart-bar-main,
.unit-performance-chart svg:has(.chart-day:hover) .chart-bar-muted,
.unit-performance-chart svg:has(.chart-day:hover) .chart-bar-return { opacity: .82; }
.chart-legend { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; color: var(--muted); font-size: 11px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.chart-legend i { width: 9px; height: 9px; border-radius: 3px; display: inline-block; }
.cost-table { min-width: 900px; }
.product-thumb { position: relative; display: grid; place-items: center; flex: 0 0 auto; width: 46px; height: 46px; border-radius: 11px; background: linear-gradient(135deg, #e8ece4, #cdd8c8); font-size: 18px; font-weight: 900; color: #71806a; }
.product-thumb img { width: 100%; height: 100%; object-fit: contain; border-radius: inherit; background: #fff; }
.product-thumb-fallback { display: grid; place-items: center; width: 100%; height: 100%; }
.product-thumb i { position: absolute; right: -5px; top: -5px; display: grid; place-items: center; width: 20px; height: 20px; border: 2px solid #fff; border-radius: 50%; color: #fff; font-size: 7px; font-style: normal; }
.product-thumb i.wildberries { background: #d225a3; }
.product-thumb i.ozon { background: #1769ff; }
.product-thumb i.yandex { background: #ffd426; color: #222; }
.product-cell em { color: #697d60; font-size: 10px; font-style: normal; }
.product-cell small.product-meta { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 3px 5px; min-width: 0; white-space: normal; line-height: 1.38; }
.copy-article { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; min-width: 0; margin: -2px 0; padding: 2px 5px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #65755d; font: inherit; font-weight: 700; line-height: 1.35; cursor: pointer; text-align: left; transition: color .15s ease, background .15s ease, border-color .15s ease, transform .15s ease; }
.copy-article:hover { border-color: #d2e8b1; background: var(--lime-soft); color: #4e7d13; }
.copy-article:active { transform: scale(.98); }
.copy-article:focus-visible { border-color: var(--lime-dark); outline: 2px solid rgba(143,198,45,.24); outline-offset: 1px; }
.copy-article-text { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
.copy-article svg { flex: 0 0 auto; opacity: .72; }
.copy-article.is-copied { border-color: #badd82; background: #e9f8d2; color: #47770d; }
.copy-article.is-copied svg { display: none; }
.copy-article.is-copied::after { content: "✓"; flex: 0 0 auto; font-size: 12px; font-weight: 900; }
.copy-article-empty { color: var(--muted); }
.product-meta-separator { flex: 0 0 auto; color: #aeb5aa; }
.product-meta-account { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
.horizontal-bars { display: flex; flex-direction: column; gap: 10px; }
.horizontal-bars > div { display: grid; grid-template-columns: 190px 1fr 115px; align-items: center; gap: 13px; font-size: 11px; }
.horizontal-bars span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.horizontal-bars i { height: 14px; background: #eef1eb; border-radius: 5px; overflow: hidden; }
.horizontal-bars i b { display: block; height: 100%; background: var(--lime-dark); border-radius: inherit; }
.horizontal-bars strong { text-align: right; }

.logistics-status { padding: 24px 29px; margin-bottom: 20px; }
.logistics-status h2 { margin: 0 0 35px; font-size: 18px; }
.calculation-note { margin: 22px 0 0; padding: 10px 12px; border: 1px solid #eadcae; border-radius: 10px; background: #fffbea; color: #796c41; font-size: 11px; line-height: 1.5; }
.readonly-note { display: block; min-height: 42px; padding: 8px 10px; border-radius: 9px; background: #f3f5f1; color: var(--muted); font-size: 11px; line-height: 1.35; }
.status-track { display: flex; height: 16px; overflow: hidden; background: #e9ece7; border-radius: 12px; }
.status-track span { min-width: 0; }
.status-legend { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; margin-top: 36px; }
.status-legend div { position: relative; padding-left: 26px; display: flex; flex-direction: column; gap: 5px; }
.status-legend i { position: absolute; left: 0; top: 4px; width: 12px; height: 12px; }
.status-legend b { font-size: 16px; }
.status-legend small { color: var(--muted); }

.expense-controls { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 18px; }
.expense-filter-group, .expense-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.expense-total-line { display: flex; align-items: baseline; gap: 12px; padding: 0 2px 14px; }
.expense-total-line span { color: var(--muted); font-size: 12px; }
.expense-total-line b { font-size: 20px; }
.expense-total-line small { color: var(--muted); margin-left: auto; }
.expense-table { min-width: 1420px; }
.expense-table td { white-space: normal; min-width: 110px; }
.expense-table td:nth-child(7) { min-width: 190px; }
.expense-row-actions-cell { width: 132px; min-width: 132px !important; }
.expense-row-actions { display: inline-flex; align-items: center; gap: 5px; }
.expense-row-action {
  width: 34px;
  min-width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 1px solid #dfe6d8;
  border-radius: 9px;
  background: #fff;
  color: #53604c;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, color .15s ease, transform .15s ease;
}
.expense-row-action:hover { border-color: #c7e395; background: var(--lime-soft); color: #4f8013; }
.expense-row-action:active { transform: scale(.96); }
.expense-row-action:focus-visible { outline: 2px solid rgba(143,198,45,.3); outline-offset: 1px; }
.expense-row-action.danger:hover { border-color: #efc1c1; background: #fff1f1; color: #bd4444; }
.row-menu-cell { position: relative; }
.row-menu { border: 0; background: transparent; font-weight: 900; cursor: pointer; letter-spacing: 2px; width: 32px; height: 32px; border-radius: 9px; }
.row-menu:hover { background: #eef3e7; }
.row-menu-popover {
  position: absolute; z-index: 30; right: 8px; top: 36px; min-width: 205px;
  padding: 7px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
  box-shadow: 0 18px 44px rgba(24, 32, 21, .16);
}
.row-menu-popover button {
  width: 100%; border: 0; border-radius: 9px; background: transparent; padding: 9px 10px;
  display: flex; align-items: center; gap: 8px; cursor: pointer; text-align: left; font-weight: 750; color: #2d352a;
}
.row-menu-popover button:hover { background: #f2f6ee; }
.row-menu-popover .danger-text, .danger-text { color: #bd4444; }
.article-cloud { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px 0; }
.expense-category-list { display: grid; gap: 8px; max-height: 320px; overflow-y: auto; padding-right: 3px; }
.expense-category-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; background: #fbfcfa;
}
.expense-category-row div { display: flex; flex-direction: column; gap: 3px; }
.expense-category-row small { color: var(--muted); font-size: 11px; }
.expense-category-row span { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }

.modal-backdrop { position: fixed; inset: 0; z-index: 100; background: rgba(19,24,18,.45); display: grid; place-items: center; padding: 20px; }
.modal { width: min(540px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; background: #fff; border-radius: 18px; box-shadow: 0 30px 80px rgba(0,0,0,.18); }
.modal:has(.integration-modal-grid) { width: min(880px, 100%); }
.modal:has(.yookassa-webhook-help) {
  display: flex;
  flex-direction: column;
  width: min(650px, 100%);
  overflow: hidden;
}
.modal:has(.yookassa-webhook-help) .modal-body { min-height: 0; overflow-y: auto; }
.modal:has(.portal-visibility-groups), .modal:has(.release-publication-list) { display: flex; flex-direction: column; width: min(760px, 100%); overflow: hidden; }
.modal:has(.portal-visibility-groups) .modal-body,
.modal:has(.release-publication-list) .modal-body { min-height: 0; overflow-y: auto; }
.modal:has(.china-delivery-edit) { width: min(1100px, calc(100vw - 40px)); }
.modal-header { display: flex; justify-content: space-between; align-items: center; padding: 19px 21px; border-bottom: 1px solid var(--line); }
.modal-header h2 { margin: 0; font-size: 18px; }
.modal-close { border: 0; background: #f0f2ef; width: 32px; height: 32px; border-radius: 9px; cursor: pointer; }
.modal-body { padding: 20px 21px; display: grid; gap: 15px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 9px; padding: 16px 21px; border-top: 1px solid var(--line); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.checkbox-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.checkbox-pill { display: flex; gap: 7px; align-items: center; border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-size: 12px; }
.integration-modal-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(250px, .85fr); gap: 16px; align-items: start; }
.integration-form-column { display: grid; gap: 15px; }
.integration-help-card { position: sticky; top: 0; display: grid; gap: 12px; padding: 16px; border: 1px solid #dfe7d7; border-radius: 16px; background: linear-gradient(180deg, #fbfff6, #f3f9eb); color: #2d352a; }
.integration-help-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #e1f5c6; color: #5f9218; }
.integration-help-card h3 { margin: 0; font-size: 15px; }
.integration-help-card ol { margin: 0; padding-left: 18px; display: grid; gap: 9px; color: #596253; font-size: 12px; line-height: 1.45; }
.integration-help-link { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 38px; padding: 0 12px; border-radius: 11px; background: var(--lime); color: #26321f; font-weight: 800; text-decoration: none; }
.toast-root { position: fixed; z-index: 200; right: 22px; bottom: 22px; display: flex; flex-direction: column; gap: 9px; }
.toast { min-width: 280px; padding: 13px 15px; border-radius: 12px; background: #1f281d; color: #fff; box-shadow: var(--shadow); font-size: 12px; animation: toast-in .2s ease-out; }
.toast.error { background: #b74949; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }

@media (max-width: 1700px) {
  .unit-metrics > div {
    min-width: 0;
    padding: 13px 8px 12px 54px;
    grid-template-columns: minmax(0, 1fr);
  }
  .unit-metrics .round-icon { left: 10px; width: 34px; height: 34px; }
  .unit-metrics small,
  .unit-metrics b,
  .unit-metrics strong,
  .unit-metrics em { grid-column: 1 / -1; min-width: 0; }
  .unit-metrics small { margin-bottom: 3px; }
  .unit-metrics b { overflow: visible; font-size: 14px; text-overflow: clip; white-space: normal; }
  .unit-metrics strong { margin-top: 2px; font-size: 11px; }
  .unit-metrics em { margin-top: 2px; font-size: 11px; }
}

@media (max-width: 1450px) {
  .unit-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1120px) {
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .content-grid { grid-template-columns: 1fr; }
  .finance-metrics { grid-template-columns: repeat(2, 1fr); }
  .finance-details { grid-template-columns: 1fr 1fr; }
  .balances-overview-grid { grid-template-columns: 1fr; }
  .logistics-donut-card { grid-column: 1 / -1; }
  .unit-metrics { grid-template-columns: repeat(3, 1fr); }
  .expense-controls { align-items: flex-start; flex-direction: column; }
  .sync-pill { display: none; }
  .plan-grid { grid-template-columns: 1fr; }
  .billing-summary, .admin-kpis { grid-template-columns: repeat(2, 1fr); }
  .billing-columns { grid-template-columns: 1fr; }
  .billing-promo-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .billing-promo-code { grid-column: 1 / -1; }
  .billing-promo-actions { justify-content: flex-end; }
  .billing-promo-quote { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .integration-modal-grid { grid-template-columns: 1fr; }
  .integration-help-card { position: static; }
}
@media (max-width: 820px) {
  .backup-schedule-grid { grid-template-columns: 1fr; }
  .backup-schedule-grid .field:last-child { grid-column: auto; }
  .backup-runtime { grid-template-columns: auto minmax(0, 1fr); }
  .backup-runtime > button { grid-column: 1 / -1; width: 100%; justify-content: center; }
  .backup-list-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .backup-list-row .ghost-button { grid-column: 2; justify-self: start; }
  .backup-list-row .row-action { grid-column: 3; grid-row: 1 / span 2; }
  .unit-chart-series-controls { width: 100%; justify-content: flex-start; margin-left: 0; }
  .balance-filter-notice { max-width: 230px; }
  .balance-filter-notice span { display: none; }
  .balance-history-panel .panel-header { flex-direction: column; }
  .balance-history-header-controls { width: 100%; justify-content: flex-start; margin-left: 0; }
  .balance-history-group-tabs { width: 100%; }
  .balance-history-account-controls { align-items: stretch; }
  .balance-history-show-all { margin-left: 0; }
  .login-screen { grid-template-columns: 1fr; }
  .login-art { display: none; }
  .login-mobile-brand { display: flex; margin-bottom: 15px; }
  .app { grid-template-columns: 1fr; }
  .app::after { content: ""; position: fixed; inset: 72px 0 0; z-index: 84; background: rgba(22, 28, 20, .38); opacity: 0; pointer-events: none; transition: opacity .18s ease; }
  body.mobile-nav-open .app::after { opacity: 1; pointer-events: auto; }
  .sidebar { position: fixed; z-index: 90; top: 72px; bottom: 0; left: 0; display: flex; width: min(310px, calc(100vw - 48px)); max-height: none; transform: translateX(-105%); box-shadow: 18px 0 44px rgba(21, 28, 19, .2); transition: transform .2s ease; }
  body.mobile-nav-open .sidebar { transform: translateX(0); }
  .main { grid-column: 1; padding: 22px 16px 44px; }
  .topbar { z-index: 100; gap: 8px; padding: 0 10px; }
  .top-icon.mobile-nav-button { display: grid; flex: 0 0 auto; }
  .topbar .brand { display: none; }
  .workspace-switch { display: flex; min-width: 170px; flex: 1; }
  .workspace-switch .workspace-icon { display: none; }
  .user-menu .user-copy, .topbar > #logoutButton { display: none; }
  .workspace-dropdown { left: 10px; right: 10px; min-width: 0; }
  .user-dropdown { right: 10px; }
}

@media (max-width: 640px) {
  .modal:has(.backup-management) { width: calc(100% - 16px); }
  .backup-list-row { column-gap: 8px; padding: 10px; }
  .backup-file-icon { width: 31px; height: 31px; }
  .topbar { gap: 6px; padding: 0 8px; }
  .workspace-switch { min-width: 0; }
  .topbar > .top-icon:not(.mobile-nav-button):not(#notificationsButton) { display: none; }
  .release-notes-drawer { width: 100%; }
  .page-header { flex-direction: column; gap: 12px; }
  .page-actions { width: 100%; flex-wrap: wrap; }
  .entity-grid, .integration-grid, .user-grid,
  .finance-details, .unit-chart-details,
  .billing-summary, .admin-kpis { grid-template-columns: 1fr; }
  .billing-promo-controls, .promo-benefit-fields, .promo-toggle-grid { grid-template-columns: 1fr; }
  .billing-promo-code { grid-column: auto; }
  .billing-promo-actions { justify-content: stretch; flex-wrap: wrap; }
  .billing-promo-actions button { flex: 1 1 130px; }
  .billing-promo-result, .billing-promo-free { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
  .billing-promo-free > button { grid-column: 1 / -1; width: 100%; }
  .billing-promo-quote { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .promo-code-form .form-grid { grid-template-columns: 1fr; }
  .portal-visibility-options { grid-template-columns: 1fr; }
  .kpi-grid, .finance-metrics, .unit-metrics { grid-template-columns: 1fr; }
  .payout-month-grid { grid-template-columns: 1fr; }
  .payout-nearest-row { grid-template-columns: 27px minmax(0, 1fr) auto; }
  .payout-nearest-row > em { grid-column: 2 / -1; justify-self: start; }
  .filters { align-items: stretch; }
  .filter-select, .filter-select summary, .date-range-control, .date-range-button { width: 100%; min-width: 0; }
  .balance-filter-notice { width: 100%; max-width: none; }
  .unit-product-filter { flex-basis: 100%; width: 100%; min-width: 0; max-width: none; }
  .unit-product-options { width: 100%; max-width: 100%; }
  .date-range-popover { top: 80px; left: 8px; right: 8px; grid-template-columns: 1fr; max-height: calc(100vh - 96px); overflow-y: auto; }
  .date-presets { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--line); }
  .calendar-pair { grid-template-columns: 1fr; }
  .calendar-month:first-child { display: none; }
}

/* Catalog statuses and wrapping */
.cost-table th:first-child { min-width: 430px; }
.cost-table td:first-child { min-width: 430px; white-space: normal; }
.cost-table th.cost-edit-column-head { overflow: visible; }
.cost-table .product-cell { min-width: 390px; max-width: 560px; align-items: flex-start; }
.cost-table .product-cell > div { min-width: 0; flex: 1; }
.cost-table .product-cell b, .cost-table .product-cell small { white-space: normal; overflow-wrap: anywhere; line-height: 1.42; }
.cost-table tr.cost-row-selected td,
.cost-table tr.cost-row-selected:hover td { background: #f4faeb; }
.cost-table tr.cost-row-dirty td { box-shadow: inset 0 1px 0 #e4efda, inset 0 -1px 0 #e4efda; }
.cost-table tr.cost-row-dirty td:first-child { box-shadow: inset 3px 0 0 var(--lime-dark), inset 0 1px 0 #e4efda, inset 0 -1px 0 #e4efda; }
.cost-editor {
  flex-wrap: wrap;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.cost-editor .cost-input { flex: 1 1 92px; width: auto; min-width: 0; }
.cost-editor .cost-save-button { min-width: auto; padding: 0 7px; white-space: nowrap; }
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.cost-table .cost-actions-column {
  width: 58px;
  min-width: 58px;
  max-width: 58px;
  padding-left: 8px;
  padding-right: 8px;
  overflow: visible;
}
.cost-row-actions { min-width: 32px; }
.cost-row-menu { min-width: 245px; }
.cost-row-menu button svg { flex: 0 0 auto; color: #65951f; }
.cost-table tbody tr:nth-last-child(-n+2) .cost-row-menu { top: auto; bottom: 35px; }
.modal:has(.cost-history-modal) { width: min(790px, calc(100vw - 40px)); }
.modal:has(.cost-history-correction) { width: min(620px, calc(100vw - 40px)); }
.cost-history-modal,
.cost-history-correction { display: grid; gap: 15px; min-width: 0; }
.cost-history-product {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 13px;
  border: 1px solid #dfe8d5;
  border-radius: 13px;
  background: #f9fcf5;
}
.cost-history-product > div:not(.product-thumb) { min-width: 0; flex: 1; }
.cost-history-product > div > b,
.cost-history-product > div > small { display: block; white-space: normal; overflow-wrap: anywhere; }
.cost-history-product > span {
  flex: 0 0 auto;
  display: grid;
  justify-items: end;
  gap: 4px;
  padding-left: 12px;
  border-left: 1px solid #dce6d1;
}
.cost-history-product > span small { color: var(--muted); font-size: 10px; }
.cost-history-product > span strong { color: #4f7e18; font-size: 17px; }
.cost-history-product.compact { padding: 10px 12px; }
.cost-history-table-wrap { max-height: min(42vh, 360px); border: 1px solid var(--line); border-radius: 12px; }
.cost-history-table { min-width: 100%; }
.cost-history-table th,
.cost-history-table td { width: 50%; }
.cost-history-events {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfcfa;
}
.cost-history-events summary {
  padding: 12px 14px;
  color: #4d5848;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.cost-history-events[open] summary { border-bottom: 1px solid var(--line); }
.cost-history-events .data-table-wrap { max-height: 260px; }
.cost-history-events .data-table { min-width: 680px; }
.cost-history-change { font-weight: 800; white-space: nowrap; }
.cost-history-date-grid input,
.cost-history-correction > .field input {
  border-color: #bfcbb4;
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(105, 148, 50, .06);
}
.catalog-tabs { display: inline-flex; align-items: center; gap: 5px; margin: 0 0 12px; padding: 5px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.catalog-tabs button { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 13px; border: 0; border-radius: 9px; background: transparent; color: #777e74; font-weight: 750; cursor: pointer; }
.catalog-tabs button.active { background: var(--lime-soft); color: #4f7a19; box-shadow: inset 0 0 0 1px #cceaa1; }
.archive-label { align-self: flex-start; padding: 3px 7px; border-radius: 6px; background: #fff1dc; color: #9a6518 !important; font-weight: 750; }

/* Revenue composition */
.finance-metric.has-popover { position: relative; padding-right: 50px; }
.finance-metric.has-popover > strong { margin-right: 12px; }
.revenue-info { position: absolute; top: 11px; right: 11px; display: grid; place-items: center; width: 27px; height: 27px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #8a9087; cursor: help; }
.revenue-info:hover, .revenue-info:focus-visible { color: #5f9218; background: #eff8e3; outline: none; }
.revenue-popover { position: absolute; z-index: 25; left: 50%; top: calc(100% - 5px); width: 330px; display: none !important; padding: 14px; border-radius: 11px; background: #252824; color: #fff; box-shadow: 0 16px 36px rgba(18,23,17,.24); transform: translateX(-50%); }
.finance-metric:hover .revenue-popover, .finance-metric:focus-within .revenue-popover,
.finance-metric.popover-open .revenue-popover { display: block !important; }
.revenue-popover > b { display: block; margin-bottom: 9px; font-size: 12px; }
.revenue-popover > div { display: grid !important; grid-template-columns: 1fr auto 46px; gap: 8px; align-items: center; padding: 5px 0; font-size: 11px; }
.revenue-popover span { color: #f1f3ef; }
.revenue-popover span em { display: block; margin-top: 2px; color: #ffb8b8; font-size: 9px; font-style: normal; }
.revenue-popover strong { margin: 0; color: #fff; text-align: right; font-size: 11px; }
.revenue-popover small { color: #c8cdc5; text-align: right; font-size: 10px; }
.expense-popover { width: 350px; }
.formula-popover { width: 360px; }
.formula-popover .negative-value { color: #ffb8b8; }
.revenue-popover .popover-total { margin-top: 5px; padding-top: 9px; border-top: 1px solid rgba(255,255,255,.2); }
.revenue-popover .popover-total span, .revenue-popover .popover-total strong { font-weight: 850; color: #d9ff9c; }
.revenue-popover .popover-subtitle { margin-top: 7px; padding-top: 9px; border-top: 1px solid rgba(255,255,255,.16); }
.revenue-popover .popover-subtitle span { color: #d9ff9c; font-weight: 850; }

/* Full comparison report */
.compare-backdrop { align-items: start; overflow-y: auto; padding: 26px; }
.compare-modal { width: min(1040px, 100%); max-height: none; overflow: visible; }
.compare-modal-body { padding: 22px 26px 34px; }
.compare-selectors { display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end; padding: 16px; border-radius: 13px; background: #f4f6f3; }
.compare-selectors .field { margin: 0; }
.compare-selectors > button { min-height: 40px; }
.comparison-loading { min-height: 220px; display: grid; place-content: center; justify-items: center; color: var(--muted); }
.comparison-section { margin-top: 28px; }
.comparison-section h3 { margin: 0 0 12px; font-size: 19px; }
.comparison-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.comparison-table th { padding: 12px 10px; background: #f5f6f4; color: #697066; text-align: right; }
.comparison-table th:first-child { text-align: left; }
.comparison-table td { padding: 13px 10px; border-bottom: 1px solid #e9ece7; text-align: right; font-variant-numeric: tabular-nums; }
.comparison-table td:first-child { width: 29%; text-align: left; font-weight: 700; }

/* Referral program */
.referral-hero { display: grid; grid-template-columns: 1fr auto; align-items: center; padding: 30px 34px; overflow: hidden; background: linear-gradient(135deg, #f7ffe9, #eff9df); border-color: #d9edbb; }
.referral-kicker { display: inline-flex; align-items: center; gap: 7px; color: #639221; font-weight: 800; font-size: 11px; }
.referral-hero h2 { margin: 12px 0 8px; font-size: 38px; }
.referral-hero p { max-width: 720px; margin: 0; color: #687162; line-height: 1.6; }
.referral-hero-icon { display: grid; place-items: center; width: 96px; height: 96px; border-radius: 26px; background: #b9ef59; color: #37570f; transform: rotate(6deg); }
.referral-share { margin-top: 15px; }
.referral-share > p { margin: 0 0 15px; color: var(--muted); }
.referral-link-row { display: grid; grid-template-columns: 1fr auto; gap: 9px; }
.referral-link-row input { min-width: 0; height: 42px; padding: 0 13px; border: 1px solid var(--line); border-radius: 10px; background: #f6f8f4; font: inherit; }
.referral-share > small { display: block; margin-top: 10px; color: var(--muted); }
.referral-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.referral-steps article { min-height: 205px; padding: 24px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }
.referral-steps article > span { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 28px; border-radius: 17px; background: var(--lime-soft); color: #5d8d1c; }
.referral-steps b { display: block; margin-bottom: 8px; font-size: 16px; }
.referral-steps p { margin: 0; color: var(--muted); line-height: 1.55; font-size: 12px; }
.referral-conditions { margin: 15px 0; }
.referral-conditions h2 { margin-top: 0; }
.referral-conditions > div { display: grid; gap: 5px; padding: 12px 0; border-top: 1px solid var(--line); }
.referral-conditions small { color: var(--muted); }

/* Yandex Market current Api-Key flow */
.yandex-connect-intro { display: flex; align-items: flex-start; gap: 12px; padding: 14px; border: 1px solid #f0dd76; border-radius: 12px; background: #fffbea; }
.yandex-connect-intro b { display: block; margin-bottom: 5px; }
.yandex-connect-intro p { margin: 0; color: #746d4e; font-size: 11px; line-height: 1.5; }
.yandex-load-button { justify-content: center; width: 100%; }

@media (max-width: 900px) {
  .compare-selectors { grid-template-columns: 1fr; }
  .referral-steps { grid-template-columns: 1fr; }
  .referral-hero { grid-template-columns: 1fr; }
  .referral-hero-icon { display: none; }
}

/* Collapsible navigation */
.nav-caption { cursor: pointer; user-select: none; }
.nav-caption svg:last-child { transition: transform .18s ease; }
.nav-section.collapsed .nav-caption svg:last-child { transform: rotate(180deg); }
.nav-section.collapsed .nav-subitem { display: none; }

/* Two-month date range picker */
.date-range-control { position: relative; }
.date-range-button { height: 40px; display: inline-flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: #f8f9f7; color: var(--text); font: inherit; font-size: 12px; cursor: pointer; }
.date-range-button:hover, .date-range-button:focus-visible { border-color: #8fc53f; outline: none; }
.date-range-popover { position: absolute; z-index: 140; top: 47px; left: 0; width: min(800px, calc(100vw - 330px)); display: grid; grid-template-columns: 155px 1fr; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: 0 20px 55px rgba(26,34,23,.18); overflow: hidden; }
.date-presets { display: flex; flex-direction: column; gap: 7px; padding: 16px 12px; border-right: 1px solid var(--line); }
.date-presets button { min-height: 34px; padding: 0 10px; border: 0; border-radius: 9px; background: #f2f3f1; text-align: left; font: inherit; font-size: 11px; cursor: pointer; }
.date-presets button:hover { color: #4f7d17; background: var(--lime-soft); }
.calendar-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 14px 18px 18px; }
.calendar-month-head { display: grid; grid-template-columns: 30px 1fr 30px; align-items: center; min-height: 38px; text-align: center; }
.calendar-month-head button { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
.calendar-month-head button:hover { background: #f0f2ee; }
.calendar-month-head b { font-size: 13px; }
.calendar-weekdays, .calendar-days { display: grid; grid-template-columns: repeat(7, 1fr); }
.calendar-weekdays span { padding: 8px 0; color: #9a9f97; text-align: center; font-size: 10px; }
.calendar-days button { position: relative; z-index: 1; height: 34px; padding: 0; border: 0; background: transparent; font: inherit; font-size: 11px; cursor: pointer; }
.calendar-days button.outside { color: #b8bdb5; }
.calendar-days button.in-range { background: #eefbdc; color: #4d6f25; }
.calendar-days button.endpoint { border-radius: 9px; background: #8bcf3f; color: #fff; font-weight: 800; }
.calendar-days button:hover:not(.endpoint) { border-radius: 9px; background: #f0f5e9; }
.date-range-actions { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 9px; padding: 12px 16px; border-top: 1px solid var(--line); }
.date-range-actions > span { margin-right: auto; color: var(--muted); font-size: 11px; }

/* Detailed logistics */
.logistics-table { min-width: 1500px; }
.logistics-table th:first-child, .logistics-table td:first-child { min-width: 380px; }
.logistics-breakdown { display: grid; gap: 4px; min-width: 210px; }
.logistics-breakdown span { display: grid; grid-template-columns: 65px 55px 1fr; gap: 7px; align-items: center; }
.logistics-breakdown small { color: var(--muted); }
.logistics-breakdown b { font-size: 10px; }
.logistics-breakdown em { color: #555d52; text-align: right; font-style: normal; font-size: 10px; }

@media (max-width: 1050px) {
  .date-range-popover { position: fixed; top: 90px; left: 20px; right: 20px; width: auto; }
}

/* Lime Analyst onboarding */
@keyframes assistantAppear {
  0% { opacity: 0; transform: translateY(16px) scale(.96); filter: blur(6px); }
  68% { opacity: 1; transform: translateY(-3px) scale(1.01); filter: blur(0); }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
@keyframes assistantFloat {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-8px) rotate(1deg); }
}
@keyframes assistantLeave {
  to { opacity: 0; transform: translateY(12px) scale(.97); max-height: 0; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; }
}
.assistant-card {
  position: relative;
  display: grid;
  grid-template-columns: 92px 1fr auto;
  gap: 18px;
  align-items: center;
  margin: 0 0 18px;
  padding: 18px 20px;
  border: 1px solid #d9edbb;
  border-radius: 20px;
  background: radial-gradient(circle at 8% 20%, rgba(185,239,89,.35), transparent 30%), linear-gradient(135deg, #fbfff5, #f1f9e8);
  box-shadow: 0 18px 45px rgba(85, 126, 32, .10);
  overflow: hidden;
  animation: assistantAppear .48s cubic-bezier(.2,.9,.2,1) both;
}
.assistant-card.compact { grid-template-columns: 74px 1fr auto; padding: 14px 16px; }
.assistant-card.is-hiding { animation: assistantLeave .24s ease forwards; overflow: hidden; }
.assistant-avatar {
  width: 82px;
  height: 82px;
  border-radius: 22px;
  background: #fff;
  display: grid;
  place-items: end center;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(105,145,44,.12), 0 10px 22px rgba(64,96,25,.12);
}
.assistant-card.compact .assistant-avatar { width: 66px; height: 66px; border-radius: 18px; }
.assistant-avatar img { width: 112%; height: 112%; object-fit: cover; object-position: center 17%; animation: assistantFloat 4.2s ease-in-out infinite; }
.assistant-avatar img,
.help-mascot-stage img,
.tour-mascot img,
.tour-tooltip-mascot img { pointer-events: none; }
.assistant-copy { min-width: 0; }
.assistant-eyebrow { display: inline-flex; align-items: center; gap: 6px; color: #5d8d1c; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .4px; }
.assistant-copy h2 { margin: 6px 0 6px; font-size: 20px; letter-spacing: -.3px; }
.assistant-card.compact .assistant-copy h2 { font-size: 16px; }
.assistant-copy p { margin: 0; color: #596253; line-height: 1.55; font-size: 13px; }
.assistant-copy ul { margin: 10px 0 0; padding-left: 18px; color: #596253; font-size: 12px; line-height: 1.55; }
.assistant-actions { display: flex; justify-content: flex-end; }
.assistant-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 10px;
  background: rgba(255,255,255,.72);
  color: #7b8374;
  cursor: pointer;
}
.assistant-close:hover { background: #fff; color: #26321f; }
.help-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 26px;
  align-items: center;
  min-height: 315px;
  margin-bottom: 18px;
  padding: 34px;
  border: 1px solid #d9edbb;
  border-radius: 26px;
  background: radial-gradient(circle at 83% 30%, rgba(185,239,89,.42), transparent 26%), linear-gradient(135deg, #fbfff5, #edf8df);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(85, 126, 32, .10);
}
.help-hero h2 { max-width: 820px; margin: 10px 0 10px; font-size: 42px; line-height: 1.04; letter-spacing: -.9px; }
.help-hero p { max-width: 760px; margin: 0; color: #586151; line-height: 1.65; }
.help-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.help-mascot-stage { position: relative; height: 280px; display: grid; place-items: center; animation: assistantAppear .58s cubic-bezier(.2,.9,.2,1) both; }
.help-mascot-stage::before { content: ""; position: absolute; inset: auto 20px 5px; height: 34px; border-radius: 50%; background: rgba(54,82,23,.13); filter: blur(10px); }
.help-mascot-stage img { position: relative; z-index: 1; max-width: 315px; width: 100%; animation: assistantFloat 4.4s ease-in-out infinite; }
.help-checklist { margin-bottom: 18px; }
.help-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.help-step-card { position: relative; min-height: 220px; padding: 18px; border: 1px solid #e3eadc; border-radius: 16px; background: #fff; }
.help-step-card .round-icon { margin-bottom: 16px; color: #5d8d1c; background: #eaffd4; }
.help-step-number { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; background: #f0f7e7; color: #5d8d1c; font-weight: 900; font-size: 12px; }
.help-step-card h3 { margin: 0 0 8px; font-size: 16px; }
.help-step-card p { min-height: 72px; margin: 0 0 14px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.help-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; margin-bottom: 18px; }
.help-article h2 { margin-top: 0; }
.help-article ol { margin: 0; padding-left: 20px; color: #596253; line-height: 1.7; font-size: 13px; }
.help-links { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 14px; }
.help-links a { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 12px; border-radius: 10px; background: #eef8e2; color: #4f7d17; text-decoration: none; font-weight: 800; font-size: 12px; }
.help-faq details { border-top: 1px solid var(--line); }
.help-faq summary { padding: 16px 0; cursor: pointer; font-weight: 800; }
.help-faq p { margin: 0 0 16px; color: var(--muted); line-height: 1.6; }
.tour-backdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(20, 28, 18, .38);
  backdrop-filter: blur(5px);
}
.tour-modal {
  position: relative;
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: 24px;
  width: min(760px, 100%);
  padding: 24px;
  border: 1px solid #d9edbb;
  border-radius: 26px;
  background: linear-gradient(135deg, #fbfff5, #f2f9e9);
  box-shadow: 0 28px 80px rgba(19, 32, 14, .28);
  overflow: hidden;
  animation: assistantAppear .42s cubic-bezier(.2,.9,.2,1) both;
}
.tour-modal.is-hiding { animation: assistantLeave .22s ease forwards; }
.tour-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 10px;
  background: rgba(255,255,255,.76);
  color: #7b8374;
  cursor: pointer;
}
.tour-close:hover { background: #fff; color: #26321f; }
.tour-mascot { position: relative; display: grid; place-items: end center; min-height: 260px; border-radius: 22px; background: radial-gradient(circle at 50% 25%, rgba(185,239,89,.48), transparent 44%), #fff; overflow: hidden; }
.tour-mascot::after { content: ""; position: absolute; left: 38px; right: 38px; bottom: 18px; height: 26px; border-radius: 50%; background: rgba(54,82,23,.13); filter: blur(8px); }
.tour-mascot img { position: relative; z-index: 1; width: 250px; max-width: 112%; animation: assistantFloat 4.1s ease-in-out infinite; }
.tour-content { align-self: center; padding-right: 26px; }
.tour-content h2 { margin: 12px 0 10px; font-size: 31px; line-height: 1.1; letter-spacing: -.5px; }
.tour-content p { margin: 0; color: #596253; line-height: 1.65; }
.tour-dots { display: flex; gap: 7px; margin: 22px 0; }
.tour-dots i { width: 8px; height: 8px; border-radius: 999px; background: #dbe4d2; transition: width .18s ease, background .18s ease; }
.tour-dots i.active { width: 28px; background: #8bcf3f; }
.tour-actions { display: flex; justify-content: flex-end; gap: 9px; }
.tour-backdrop.guided-tour {
  display: block;
  padding: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  pointer-events: none;
}
.tour-highlight-target {
  position: relative;
  z-index: 131 !important;
  border-radius: 12px;
}
.tour-spotlight {
  position: fixed;
  z-index: 130;
  border: 3px solid #b9ef59;
  border-radius: 18px;
  background: rgba(255,255,255,.04);
  box-shadow: 0 0 0 9999px rgba(20, 28, 18, .42), 0 0 0 8px rgba(185, 239, 89, .20), 0 18px 45px rgba(48, 82, 18, .18);
  animation: assistantAppear .28s cubic-bezier(.2,.9,.2,1) both;
  pointer-events: none;
}
.tour-spotlight::after {
  content: "";
  position: absolute;
  inset: -10px;
  border: 1px solid rgba(185, 239, 89, .55);
  border-radius: 24px;
  animation: tourPulse 1.55s ease-in-out infinite;
}
@keyframes tourPulse {
  0%, 100% { opacity: .45; transform: scale(1); }
  50% { opacity: .9; transform: scale(1.025); }
}
.tour-tooltip {
  position: fixed;
  z-index: 132;
  display: grid;
  grid-template-columns: 82px 1fr;
  gap: 14px;
  box-sizing: border-box;
  min-height: 190px;
  max-height: calc(100vh - 32px);
  overflow: visible;
  padding: 16px;
  border: 1px solid #d9edbb;
  border-radius: 22px;
  background: linear-gradient(135deg, #fbfff5, #f2f9e9);
  box-shadow: 0 24px 70px rgba(19, 32, 14, .28);
  animation: assistantAppear .36s cubic-bezier(.2,.9,.2,1) both;
  pointer-events: none;
  cursor: grab;
  touch-action: none;
}
.tour-tooltip.is-hiding { animation: assistantLeave .22s ease forwards; }
.tour-tooltip.is-dragging {
  cursor: grabbing;
  user-select: none;
  transition: none;
  box-shadow: 0 30px 86px rgba(19, 32, 14, .34);
}
.tour-tooltip button,
.tour-tooltip a,
.tour-tooltip input,
.tour-tooltip select,
.tour-tooltip textarea { cursor: pointer; pointer-events: auto; }
.tour-tooltip .tour-close { top: 9px; right: 9px; }
.tour-tooltip-mascot {
  align-self: start;
  display: grid;
  place-items: end center;
  width: 78px;
  height: 100px;
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(105,145,44,.12);
}
.tour-tooltip-mascot img {
  width: 118px;
  max-width: none;
  transform: translateY(8px);
  animation: assistantFloat 4.1s ease-in-out infinite;
}
.tour-tooltip .tour-content { min-width: 0; padding: 2px 20px 0 0; overflow: visible; }
.tour-tooltip .tour-content,
.tour-tooltip .tour-actions { pointer-events: auto; }
.tour-tooltip .tour-content h2 { margin: 8px 0 7px; font-size: 20px; line-height: 1.15; }
.tour-tooltip .tour-content p { font-size: 13px; }
.tour-tooltip .tour-content > * { max-width: 100%; }
.tour-instruction {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  margin-top: 12px;
  padding: 11px 12px;
  border-radius: 13px;
  background: #eaffd4;
  color: #3f6612;
  font-weight: 800;
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.tour-instruction svg { flex: 0 0 auto; }
.tour-drag-hint {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 9px;
  color: #7d8b75;
  font-size: 11px;
  font-weight: 700;
}
.tour-tooltip .tour-dots { margin: 13px 0; }
.tour-tooltip .tour-actions { justify-content: space-between; flex-wrap: wrap; }
.tour-tooltip .tour-actions button { min-width: 0; }
.tour-tooltip .tour-actions button:disabled { opacity: .45; cursor: default; }

@media (max-width: 1180px) {
  .assistant-card, .assistant-card.compact { grid-template-columns: 64px 1fr; }
  .assistant-actions { grid-column: 2; justify-content: flex-start; }
  .help-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .help-hero { grid-template-columns: 1fr 220px; }
  .help-hero h2 { font-size: 34px; }
}
@media (max-width: 760px) {
  .assistant-card, .assistant-card.compact, .help-hero, .help-grid { grid-template-columns: 1fr; }
  .assistant-avatar { display: none; }
  .assistant-actions { grid-column: auto; }
  .help-mascot-stage { height: 210px; }
  .help-steps { grid-template-columns: 1fr; }
  .tour-modal { grid-template-columns: 1fr; }
  .tour-tooltip { left: 16px !important; right: 16px; top: auto !important; bottom: 16px; width: auto !important; grid-template-columns: 64px 1fr; }
  .tour-tooltip-mascot { width: 60px; height: 78px; }
  .tour-tooltip-mascot img { width: 94px; }
  .tour-mascot { min-height: 180px; }
  .tour-content { padding-right: 0; }
  .tour-content h2 { font-size: 25px; }
}

@media (max-width: 640px) {
  .date-range-popover { top: 80px; left: 8px; right: 8px; grid-template-columns: 1fr; max-height: calc(100vh - 96px); overflow-y: auto; }
  .date-presets { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--line); }
  .calendar-pair { grid-template-columns: 1fr; }
  .calendar-month:first-child { display: none; }
}

/* Stocks */
.stocks-banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: 11px;
  margin-bottom: 14px;
  padding: 13px 15px;
  border: 1px solid #dbe9ca;
  border-radius: 13px;
  background: #f7fcf0;
  color: #4d6635;
  font-size: 12px;
  line-height: 1.5;
}
.stocks-banner > svg, .stocks-banner > i {
  flex: 0 0 auto;
  width: 19px;
  height: 19px;
  margin-top: 1px;
  color: #6c9e2b;
}
.stocks-banner b { display: block; margin-bottom: 2px; color: #34442a; font-size: 13px; }
.stocks-banner p { margin: 0; }
.stocks-banner.info { border-color: #dbe9ca; background: #f7fcf0; color: #526747; }
.stocks-banner.warning { border-color: #eadcae; background: #fffbea; color: #796c41; }
.stocks-banner.warning > svg, .stocks-banner.warning > i { color: var(--warning); }
.stocks-banner.warning b { color: #665824; }
.stocks-banner button, .stocks-banner a { align-self: center; white-space: nowrap; }
.stocks-banner-dismiss {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 9px;
  background: rgba(255,255,255,.72);
  color: currentColor;
  cursor: pointer;
}
.stocks-banner-dismiss:hover { background: #fff; color: #44523a; }

.stocks-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}
.stocks-toolbar > .stocks-tabs { margin-right: auto; }
.stocks-toolbar .filter-select summary, .stocks-toolbar .toolbar-select { min-width: 150px; }
.stocks-toolbar .filters-spacer { min-width: 12px; }
.stocks-zero-filter {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8f9f7;
  color: #4f584a;
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
  cursor: pointer;
}
.stocks-zero-filter:hover { border-color: #c9e69c; background: #fbfff5; }
.stocks-zero-filter input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--lime-dark);
  cursor: pointer;
}
.stock-management-table-wrap,
.stock-fbo-table-wrap,
.stock-forecast-table-wrap {
  max-height: min(70vh, calc(100vh - 260px));
  overflow: auto;
  overscroll-behavior: contain;
}
.stock-management-table-wrap .data-table th,
.stock-fbo-table-wrap .data-table th,
.stock-forecast-table-wrap .data-table th {
  top: 0;
  z-index: 8;
  box-shadow: 0 1px 0 #dfe3dc;
}
.stocks-toolbar .toolbar-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: #596253;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}
.stocks-toolbar .toolbar-button:hover { border-color: #cce5a7; background: var(--lime-soft); color: #4e7c13; }
.stocks-toolbar .toolbar-button:focus-visible { outline: 2px solid rgba(143,198,45,.3); outline-offset: 1px; }
.stocks-search {
  width: min(300px, 100%);
  min-width: 220px;
  height: 40px;
  padding: 0 13px 0 38px;
  border: 1px solid var(--line);
  border-radius: 10px;
  outline: none;
  background: #f8f9f7;
  color: var(--text);
}
.stocks-search:focus {
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px rgba(185,239,89,.2);
  background: #fff;
}
.stocks-search::placeholder { color: #a0a69c; }
.stocks-toolbar .table-column-button { margin-left: 0; }
.stock-save-all-button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 12px;
  white-space: nowrap;
}
.stock-save-all-button small { font-size: 10px; font-weight: 850; }
.stock-target-label {
  display: block;
  max-width: 170px;
  margin-top: 4px;
  overflow: hidden;
  color: #7a8374;
  font-size: 9px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stocks-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(170px, 1fr));
  gap: 13px;
  margin-bottom: 16px;
}
.stocks-kpi-card {
  position: relative;
  min-height: 128px;
  padding: 17px 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(31,43,25,.035);
}
.stocks-kpi-card::after {
  content: "";
  position: absolute;
  right: -30px;
  bottom: -42px;
  width: 105px;
  height: 105px;
  border-radius: 50%;
  background: rgba(185,239,89,.13);
  pointer-events: none;
}
.stocks-kpi-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.stocks-kpi-card > span:first-child {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: var(--lime-soft);
  color: #669b1e;
}
.stocks-kpi-card > div { position: relative; z-index: 1; min-width: 0; }
.stocks-kpi-card small {
  display: block;
  min-height: 18px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}
.stocks-kpi-card b, .stocks-kpi-card strong {
  position: relative;
  z-index: 1;
  display: block;
  margin: 8px 0 5px;
  font-size: 23px;
  letter-spacing: -.65px;
  font-variant-numeric: tabular-nums;
}
.stocks-kpi-card em, .stocks-kpi-card p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  line-height: 1.4;
}
.stocks-kpi-card.accent {
  border-color: #cce7a3;
  background: linear-gradient(145deg, #fbfff5, #f1fadd);
}

.stocks-tabs {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f4f6f2;
}
.stocks-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 70px;
  min-height: 35px;
  padding: 0 13px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #737a70;
  font-weight: 780;
  font-size: 12px;
  cursor: pointer;
  white-space: nowrap;
}
.stocks-tab:hover { background: #fff; color: #4f5a49; }
.stocks-tab.active, .stocks-tab[aria-selected="true"] {
  background: var(--lime-soft);
  color: #4e7c13;
  box-shadow: inset 0 0 0 1px #c9e79c;
}
.stocks-tab:focus-visible { outline: 2px solid rgba(143,198,45,.35); outline-offset: 1px; }
.stocks-tab small {
  min-width: 20px;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(102,118,91,.1);
  color: inherit;
  font-size: 9px;
}

.stock-fbo-view-tabs { margin-bottom: 14px; }
.stock-fbo-time-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.stock-fbo-time-tabs { flex: 0 0 auto; }
.stock-fbo-history-date {
  display: grid;
  grid-template-columns: auto minmax(132px, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 43px;
  padding: 4px 5px 4px 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}
.stock-fbo-history-date input {
  width: 142px;
  min-width: 0;
  height: 33px;
  padding: 0 8px;
  border: 1px solid #dfe5da;
  border-radius: 9px;
  outline: none;
  background: #f7f9f5;
  color: var(--text);
  font: inherit;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.stock-fbo-history-date input:focus {
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px rgba(185,239,89,.2);
  background: #fff;
}
.stock-fbo-history-status {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid #cfe6aa;
  border-radius: 14px;
  background: linear-gradient(135deg, #fbfff5, #f4faea);
}
.stock-fbo-history-status.warning {
  border-color: #ead7ad;
  background: linear-gradient(135deg, #fffdf7, #fff8e9);
}
.stock-fbo-history-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: min(100%, 235px);
  color: #668f2b;
}
.stock-fbo-history-status.warning .stock-fbo-history-heading { color: #a06b17; }
.stock-fbo-history-heading > div { display: grid; gap: 2px; min-width: 0; }
.stock-fbo-history-heading b { color: var(--text); font-size: 13px; }
.stock-fbo-history-heading small { color: var(--muted); font-size: 10px; line-height: 1.35; }
.stock-fbo-snapshot-list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}
.stock-fbo-snapshot-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 250px;
  min-height: 38px;
  padding: 5px 9px;
  border: 1px solid rgba(143,198,45,.25);
  border-radius: 10px;
  background: rgba(255,255,255,.82);
}
.stock-fbo-snapshot-chip > span:last-child { display: grid; gap: 1px; min-width: 0; }
.stock-fbo-snapshot-chip b {
  overflow: hidden;
  font-size: 10px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.stock-fbo-snapshot-chip small {
  color: var(--muted);
  font-size: 9px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.stock-fbo-history-missing {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: #93631d;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.4;
}
.stock-fbo-history-hint {
  flex: 1 1 100%;
  margin: -3px 0 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}
.stock-fbo-available-dates {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
  padding-top: 9px;
  border-top: 1px solid rgba(169,132,63,.16);
}
.stock-fbo-available-dates > span {
  margin-right: 2px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}
.stock-fbo-available-dates button {
  min-height: 29px;
  padding: 0 9px;
  border: 1px solid #d7e1cd;
  border-radius: 8px;
  background: #fff;
  color: #596750;
  font-size: 10px;
  font-weight: 780;
  cursor: pointer;
}
.stock-fbo-available-dates button:hover,
.stock-fbo-available-dates button:focus-visible {
  border-color: #b9d98c;
  background: var(--lime-soft);
  color: #4e7c13;
  outline: none;
}
.stock-fbo-warehouse-table { min-width: 1180px; }
.stock-fbo-warehouse-table th:first-child,
.stock-fbo-warehouse-table td:first-child { min-width: 360px; }
.stock-fbo-warehouse-cell {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.stock-fbo-warehouse-cell > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  max-width: 100%;
}
.stock-fbo-warehouse-cell b,
.stock-fbo-warehouse-cell small {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.stock-fbo-warehouse-cell small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 650;
}
.stock-fbo-warehouse-table .group-indent {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  align-items: flex-start;
}
.stock-fbo-warehouse-table .group-indent .product-cell {
  min-width: 0;
  max-width: 100%;
}
.stock-fbo-warehouse-table tr[hidden] { display: none; }

.stocks-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 7px;
  background: #f0f3ed;
  color: #646d5f;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}
.stocks-status::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #99a095;
}
.stocks-status.known { background: #edf8df; color: #4d7818; }
.stocks-status.known::before { background: #79ba27; box-shadow: 0 0 0 3px rgba(121,186,39,.12); }
.stocks-status.aggregate { background: #f1edff; color: #684fb7; }
.stocks-status.aggregate::before { background: var(--purple); }
.stocks-status.manual { background: #fff4df; color: #956017; }
.stocks-status.manual::before { background: var(--warning); }
.stocks-status.unknown { background: #f0f2ef; color: #858b82; }
.stocks-status.unknown::before { background: #a9afa6; }

.stocks-group-table {
  min-width: 1120px;
  font-variant-numeric: tabular-nums;
}
.capitalization-table-panel > .panel-header {
  align-items: flex-start;
  margin: 0;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
}
.capitalization-table-panel > .panel-header p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 11px;
}
.capitalization-table-panel .data-table-wrap { width: 100%; }
.capitalization-table-panel .stocks-group-table {
  width: 100%;
  min-width: 1120px;
}
.capitalization-market-cell {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.capitalization-market-cell .market-icon { flex: 0 0 auto; }
.capitalization-table-panel tfoot th {
  position: static;
  top: auto;
  padding-top: 13px;
  padding-bottom: 13px;
  border-top: 2px solid #d8e7c9;
  background: #f1f7eb;
  color: #35452c;
}
.stocks-group-table th, .stocks-group-table td { text-align: right; }
.stocks-group-table th:first-child, .stocks-group-table td:first-child { min-width: 330px; text-align: left; }
.stocks-group-table td.column-user-sized {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.stocks-group-table td:first-child.column-user-sized,
.stocks-group-table th:first-child.column-user-sized { min-width: 130px; }
.stocks-group-table td.column-user-sized .group-indent {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  white-space: normal;
}
.stocks-group-table td.column-user-sized :is(.group-indent, .stocks-status, .stock-status-cell) {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.stocks-group-table tbody + tbody .stocks-group-row td { border-top-width: 2px; }
.stocks-group-row td {
  padding-top: 10px;
  padding-bottom: 10px;
  border-top: 1px solid #dae3d3;
  background: #f5f8f2;
  color: #36402f;
  font-weight: 800;
}
.stocks-group-row:hover td { background: #f0f6ea; }
.stocks-group-row button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-align: left;
}
.stocks-group-row button svg { transition: transform .18s ease; }
.stocks-group-row.collapsed button svg, .stocks-group-row button[aria-expanded="false"] svg { transform: rotate(-90deg); }
.stocks-group-table td > small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
.stocks-group-table tr:not(.stocks-group-row):hover td { background: #fbfcfa; }

.stocks-group-table th.stocks-recommendation,
.stocks-group-table td.stocks-recommendation,
.stocks-recommendation {
  border-right-color: #dcebc7;
  border-left: 1px solid #dcebc7;
  background: #f5fbe9;
  color: #3f6019;
}
.stocks-group-table th.stocks-recommendation {
  background: #eaf6d7;
  color: #4e741e;
}
.stocks-group-table tr:hover td.stocks-recommendation { background: #eff8df; }
.stocks-recommendation b, .stocks-recommendation strong { color: #426a12; }
.stocks-recommendation small { color: #6e8c4a !important; }

.stocks-methodology {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin: 14px 0 16px;
  padding: 15px 17px;
  border: 1px solid #dfe7d7;
  border-radius: 14px;
  background: #fafcf8;
  color: #596253;
  font-size: 11px;
  line-height: 1.55;
}
.stocks-methodology > svg { flex: 0 0 auto; color: #70a82a; }
.stocks-methodology b { color: #35402f; font-size: 12px; }
.stocks-methodology div > p { margin: 3px 0 0; }
.stocks-methodology summary {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #35402f;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.stocks-methodology summary::marker { color: var(--lime-dark); }
.stocks-methodology p { margin: 11px 0 0; }
.stocks-methodology ul { display: grid; gap: 5px; margin: 10px 0 0; padding-left: 18px; }
.stocks-formula {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  margin-top: 9px;
  padding: 7px 9px;
  border: 1px solid #e3e9dc;
  border-radius: 8px;
  background: #fff;
  color: #4d5947;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 10px;
  overflow-wrap: anywhere;
}

.data-table.stocks-account-columns {
  display: table;
  min-width: 1180px;
  margin-top: 0;
  font-variant-numeric: tabular-nums;
}
.data-table.stocks-account-columns td {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.data-table.stocks-account-columns th.stock-edit-column-head {
  z-index: 12;
  overflow: visible;
}
.stock-select-heading,
.stock-product-select {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  min-width: 0;
}
.stock-select-heading { align-items: center; }
.stock-select-heading input,
.stock-product-select > input {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--lime-dark);
  cursor: pointer;
}
.stock-product-select > input { margin-top: 10px; }
.stock-product-select > .product-cell {
  flex: 1;
  min-width: 0;
}
.data-table.stocks-account-columns tr.stock-row-selected td,
.data-table.stocks-account-columns tr.stock-row-selected:hover td {
  background: #f4faeb;
}
.stock-edit-heading {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  min-width: 0;
}
.stock-column-menu-toggle {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  margin: -6px 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #737b70;
  cursor: pointer;
}
.stock-column-menu-toggle:hover,
.stock-column-menu-toggle[aria-expanded="true"] {
  background: #eaf4dc;
  color: #56851c;
}
.stock-column-menu-toggle:disabled { opacity: .5; cursor: wait; }
.stock-column-menu {
  position: fixed;
  z-index: 180;
  width: 285px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 20px 50px rgba(24, 32, 21, .18);
  white-space: normal;
}
.stock-column-menu > button {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 10px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #2d352a;
  text-align: left;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}
.stock-column-menu > button:hover { background: #f2f7eb; }
.stock-column-menu > button:disabled { opacity: .45; cursor: not-allowed; }
.stock-column-menu > button > svg,
.stock-column-menu > button > i { flex: 0 0 auto; margin-top: 1px; color: #6d9f2e; }
.stock-column-menu > button span { display: grid; gap: 3px; line-height: 1.3; }
.stock-column-menu > button small { color: var(--muted); font-size: 10px; font-weight: 600; }
.stock-bulk-modal { width: min(410px, 100%); }
.stock-bulk-form { display: grid; gap: 14px; }
.stock-bulk-form > p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.stock-bulk-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid #dce9cd;
  border-radius: 11px;
  background: #f7fbf1;
  color: #5f8d28;
}
.stock-bulk-summary > svg,
.stock-bulk-summary > i { flex: 0 0 auto; }
.stock-bulk-summary span { display: grid; gap: 2px; }
.stock-bulk-summary b { color: #34442a; font-size: 12px; }
.stock-bulk-summary small { color: var(--muted); font-size: 10px; }
.data-table:is(.stocks-account-columns, .stocks-group-table) th.column-user-sized {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.25;
}
.data-table.stocks-account-columns td:first-child.column-user-sized,
.data-table.stocks-account-columns th:first-child.column-user-sized {
  min-width: 130px;
}
.data-table.stocks-account-columns .product-cell {
  align-items: flex-start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.data-table.stocks-account-columns .product-cell > div {
  flex: 1;
  min-width: 0;
  max-width: 100%;
}
.data-table.stocks-account-columns .product-cell b,
.data-table.stocks-account-columns .product-cell small,
.data-table.stocks-account-columns .product-cell em {
  display: block;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.38;
}
.account-column-title, .account-cell, .group-indent {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.data-table.stocks-account-columns .account-column-title,
.data-table.stocks-account-columns .account-cell {
  align-items: flex-start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  white-space: normal;
}
.account-column-title > span, .account-cell > span, .group-indent > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.account-column-title small, .account-cell small, .group-indent small,
.cell-note, .stock-status-cell > small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 500;
}
.stock-status-cell { display: grid; justify-items: start; gap: 2px; }
.data-table.stocks-account-columns td.column-user-sized .stocks-status {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.data-table.stocks-account-columns td.column-user-sized .stocks-stock-editor {
  flex-wrap: wrap;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.data-table.stocks-account-columns td.column-user-sized .stocks-stock-editor input {
  flex: 1 1 72px;
  width: auto;
  min-width: 0;
}
.data-table.stocks-account-columns td.column-user-sized > b {
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
}
.filter-inline-select {
  display: grid;
  gap: 3px;
  min-width: 145px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}
.filter-inline-select small { color: var(--muted); font-size: 9px; }
.filter-inline-select select { border: 0; outline: 0; background: transparent; color: var(--text); font: inherit; font-weight: 750; }
.stock-forecast-sales-window { min-width: 180px; }
.stock-forecast-sales-window > span { display: flex; align-items: center; gap: 6px; }
.stock-forecast-sales-window input {
  width: 58px;
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-weight: 800;
}
.stock-forecast-sales-window b { color: var(--text); font-size: 11px; }
.stock-forecast-advice {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  max-width: 190px;
  padding: 5px 9px;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.3;
  white-space: normal;
}
.stock-forecast-advice.urgent { border-color: #f2aaaa; background: #ffe4e4; color: #a51f1f; }
.stock-forecast-advice.planning { border-color: #f1c17d; background: #fff0d9; color: #965400; }
.stock-forecast-advice.consider { border-color: #ead77b; background: #fff9cc; color: #756300; }
.stock-forecast-advice.enough { border-color: #cde5a9; background: #edf8dd; color: #3f7112; }
.stock-forecast-advice.unknown { border-color: #dfe3dc; background: #f2f4f1; color: #737a70; }
.stocks-future {
  position: relative;
  min-height: 180px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-content: center;
  align-items: center;
  gap: 6px 14px;
  padding: 22px;
  overflow: hidden;
  border: 1px dashed #cfd8c8;
  border-radius: 15px;
  background: linear-gradient(145deg, #fbfcfa, #f3f6f0);
}
.stocks-future::after {
  content: "";
  position: absolute;
  right: -44px;
  bottom: -62px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: rgba(185,239,89,.12);
}
.stocks-future-icon {
  grid-row: 1 / 4;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--lime-soft);
  color: #669b1e;
}
.stocks-future h2, .stocks-future h3 { margin: 0; font-size: 18px; }
.stocks-future p { max-width: 430px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.stocks-future > b { color: #587d28; font-size: 13px; }
.stocks-future > button { grid-column: 2; justify-self: start; margin-top: 8px; }
.stocks-future-badge {
  position: absolute;
  z-index: 1;
  top: 13px;
  right: 13px;
  padding: 5px 8px;
  border-radius: 7px;
  background: #e9ede5;
  color: #727a6e;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .25px;
  text-transform: uppercase;
}

.stocks-stock-editor {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 100px;
}
.stocks-stock-editor input {
  width: 92px;
  height: 34px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  outline: 0;
  background: #fff;
  font: inherit;
}
.stocks-stock-editor input:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px rgba(185,239,89,.18); }
.stocks-stock-editor input[aria-invalid="true"] { border-color: #e45b5b; box-shadow: 0 0 0 3px rgba(228,91,91,.12); }
.stocks-stock-editor button { min-width: 34px; min-height: 34px; padding: 0; }

@media (max-width: 1120px) {
  .stocks-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .stocks-banner { grid-template-columns: auto minmax(0, 1fr); }
  .stocks-banner button, .stocks-banner a { grid-column: 2; justify-self: start; }
  .stocks-toolbar { align-items: stretch; }
  .stocks-toolbar > .stocks-tabs { width: 100%; margin-right: 0; }
  .stocks-tab { flex: 1; min-width: 0; }
  .stocks-search { flex: 1 1 100%; width: 100%; min-width: 0; }
  .stocks-toolbar .filter-select, .stocks-toolbar .filter-select summary,
  .stocks-toolbar .toolbar-select { flex: 1 1 180px; min-width: 0; }
  .stocks-stock-editor { min-width: 130px; }
}

@media (max-width: 560px) {
  .stocks-summary-grid { grid-template-columns: 1fr; }
  .stocks-kpi-card { min-height: 112px; }
  .stocks-tabs { overflow-x: auto; }
  .stocks-tab { min-width: 76px; }
  .stocks-future { grid-template-columns: 1fr; padding: 56px 18px 20px; }
  .stocks-future-icon { grid-row: auto; }
  .stocks-future > button { grid-column: 1; }
}

/* Product catalog */
.catalog-account-tabs {
  display: flex;
  align-items: stretch;
  gap: 4px;
  margin: 0 0 14px;
  padding: 5px;
  overflow-x: auto;
  overflow-y: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  scrollbar-width: thin;
  scrollbar-color: #cfd5cb transparent;
}
.catalog-account-tabs::-webkit-scrollbar { height: 6px; }
.catalog-account-tabs::-webkit-scrollbar-thumb { border-radius: 999px; background: #cfd5cb; }
.catalog-account-tabs button,
.catalog-account-tab {
  position: relative;
  flex: 0 0 auto;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #697166;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
  transition: color .15s ease, background .15s ease, box-shadow .15s ease;
}
.catalog-account-tabs button:hover,
.catalog-account-tab:hover { background: #f3f6ef; color: #35402f; }
.catalog-account-tabs button.active,
.catalog-account-tabs button[aria-selected="true"],
.catalog-account-tab.active,
.catalog-account-tab[aria-selected="true"] {
  background: var(--lime-soft);
  color: #477713;
  box-shadow: inset 0 0 0 1px #cce8a5;
}
.catalog-account-tabs button.active::after,
.catalog-account-tabs button[aria-selected="true"]::after,
.catalog-account-tab.active::after,
.catalog-account-tab[aria-selected="true"]::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: 2px;
  left: 12px;
  height: 2px;
  border-radius: 999px;
  background: var(--lime-dark);
}
.catalog-account-tabs button:focus-visible,
.catalog-account-tab:focus-visible {
  outline: 2px solid rgba(143,198,45,.35);
  outline-offset: 1px;
}
.catalog-account-tabs .market-icon { width: 25px; height: 25px; border-radius: 7px; font-size: 8px; }
.catalog-account-tabs small {
  padding: 2px 6px;
  border-radius: 999px;
  background: #edf1e9;
  color: #778071;
  font-size: 9px;
  font-weight: 850;
}
.catalog-account-tabs .active small,
.catalog-account-tabs [aria-selected="true"] small { background: #dff2c2; color: #4f791e; }

.catalog-panel {
  position: relative;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(34,48,29,.035);
}
.catalog-panel-head {
  min-height: 76px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 17px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, #fff, #fcfdfb);
}
.catalog-panel-head h2 { margin: 0 0 5px; font-size: 17px; }
.catalog-panel-head p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.catalog-panel-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}
.catalog-panel-actions button {
  min-height: 38px;
  height: auto;
  padding-top: 7px;
  padding-bottom: 7px;
  white-space: nowrap;
}
.catalog-toolbar {
  position: relative;
  z-index: 12;
  min-height: 66px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.catalog-toolbar-main,
.catalog-toolbar-actions,
.catalog-toolbar-selection {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.catalog-toolbar-main { flex: 1 1 auto; }
.catalog-toolbar-actions { flex: 0 0 auto; margin-left: auto; }
.catalog-toolbar-selection {
  flex: 1 1 100%;
  padding: 8px 11px;
  border: 1px solid #d5e8b9;
  border-radius: 11px;
  background: #f4faeb;
  color: #486e20;
  font-size: 11px;
  font-weight: 750;
}
.catalog-toolbar-selection b { color: #315411; }
.catalog-toolbar-count,
.catalog-result-count {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.catalog-toolbar button:not(.table-column-button) {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 10px;
  white-space: nowrap;
}
.catalog-toolbar .table-column-button { margin-left: 0; }
.catalog-toolbar-spacer { flex: 1 1 auto; min-width: 8px; }
.catalog-page-size {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}
.catalog-page-size select {
  height: 38px;
  min-width: 70px;
  padding: 0 28px 0 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  outline: 0;
  background: #f8f9f7;
  color: var(--text);
  font-weight: 750;
}
.catalog-page-size select:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px rgba(185,239,89,.18); }
.catalog-filter-button { position: relative; }
.catalog-filter-button.active {
  border: 1px solid #cbe4a7;
  background: var(--lime-soft);
  color: #4b7618;
}
.catalog-filter-button b {
  min-width: 19px;
  height: 19px;
  display: inline-grid;
  place-items: center;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--lime-dark);
  color: #fff;
  font-size: 9px;
}
.catalog-selection-bar {
  min-height: 46px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 16px;
  border-bottom: 1px solid #dceac8;
  background: #f3f9e9;
  color: #547329;
  font-size: 11px;
}
.catalog-selection-bar > svg { color: #6ca421; }
.catalog-selection-bar b { color: #345511; }
.catalog-selection-bar .link-button:last-child { margin-left: auto; }
.link-button {
  padding: 3px 4px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #56871b;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.link-button:hover { background: #e3f1cf; color: #3f6e0c; }
.link-button:focus-visible { outline: 2px solid rgba(143,198,45,.32); outline-offset: 1px; }
.catalog-table-toolbar { min-height: 54px; background: #fff; }

.catalog-search:not(input) {
  position: relative;
  flex: 1 1 330px;
  min-width: 220px;
  max-width: 520px;
}
.catalog-search:not(input) > svg,
.catalog-search:not(input) > .lucide {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 12px;
  width: 17px;
  height: 17px;
  color: #929a8e;
  pointer-events: none;
  transform: translateY(-50%);
}
.catalog-search input,
input.catalog-search {
  width: 100%;
  min-width: 0;
  height: 40px;
  padding: 0 37px;
  border: 1px solid var(--line);
  border-radius: 10px;
  outline: none;
  background: #f8f9f7;
  color: var(--text);
  font-size: 12px;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
input.catalog-search { width: min(420px, 100%); padding-left: 13px; }
.catalog-search input::placeholder,
input.catalog-search::placeholder { color: #9da49a; }
.catalog-search input:focus,
input.catalog-search:focus {
  border-color: var(--lime-dark);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(185,239,89,.2);
}
.catalog-search-clear {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 5px;
  width: 30px;
  min-height: 30px !important;
  padding: 0 !important;
  border: 0;
  border-radius: 8px !important;
  background: transparent;
  color: #8a9285;
  cursor: pointer;
  transform: translateY(-50%);
}
.catalog-search-clear:hover { background: #e9eee5; color: #4c5748; }
.catalog-search > button,
#catalogSearchClear {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 5px;
  width: 30px;
  min-width: 30px;
  min-height: 30px !important;
  height: 30px;
  padding: 0 !important;
  border: 0;
  border-radius: 8px !important;
  background: transparent;
  color: #899285;
  cursor: pointer;
  transform: translateY(-50%);
}
.catalog-search > button:hover,
#catalogSearchClear:hover { background: #e9eee5; color: #4c5748; }

.catalog-table-wrap {
  position: relative;
  max-height: min(720px, calc(100vh - 315px));
  min-height: 260px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #cbd2c7 #f5f7f3;
}
.catalog-table-wrap::-webkit-scrollbar { width: 10px; height: 10px; }
.catalog-table-wrap::-webkit-scrollbar-track { background: #f5f7f3; }
.catalog-table-wrap::-webkit-scrollbar-thumb {
  border: 2px solid #f5f7f3;
  border-radius: 999px;
  background: #cbd2c7;
}
.catalog-table-wrap::-webkit-scrollbar-thumb:hover { background: #abb5a6; }
.catalog-table,
.catalog-table-wrap .data-table {
  min-width: 1260px;
  border-collapse: separate;
  border-spacing: 0;
}
.catalog-table-wrap .data-table th,
.catalog-table th {
  position: sticky;
  z-index: 9;
  top: 0;
  height: 46px;
  padding-top: 9px;
  padding-bottom: 9px;
  background: #f6f8f4;
  box-shadow: inset 0 -1px 0 #dfe4dc;
}
.catalog-table-wrap .data-table td,
.catalog-table td {
  min-width: 104px;
  height: 62px;
  padding-top: 9px;
  padding-bottom: 9px;
  white-space: normal;
  line-height: 1.42;
}
.catalog-table-wrap .data-table td:first-child,
.catalog-table-wrap .data-table th:first-child,
.catalog-table td:first-child,
.catalog-table th:first-child { min-width: 310px; }
.catalog-table-wrap .catalog-table td:first-child,
.catalog-table-wrap .catalog-table th:first-child,
.catalog-table td:first-child,
.catalog-table th:first-child {
  width: 52px;
  min-width: 52px;
  max-width: 52px;
  text-align: center;
}
.catalog-table-wrap .catalog-table td:first-child input,
.catalog-table-wrap .catalog-table th:first-child input,
.catalog-table td:first-child input,
.catalog-table th:first-child input {
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--lime-dark);
}
.catalog-table th:first-child .column-resizer,
.catalog-editor-table th:first-child .column-resizer { display: none; }
.catalog-table-wrap .data-table td:first-child.column-user-sized,
.catalog-table-wrap .data-table th:first-child.column-user-sized { min-width: 130px; }
.catalog-table-wrap .product-cell,
.catalog-table .product-cell {
  min-width: 270px;
  max-width: 470px;
  align-items: flex-start;
}
.catalog-table-wrap .product-cell > div,
.catalog-table .product-cell > div { min-width: 0; flex: 1; }
.catalog-table-wrap .product-cell b,
.catalog-table-wrap .product-cell small,
.catalog-table-wrap .product-cell em,
.catalog-table .product-cell b,
.catalog-table .product-cell small,
.catalog-table .product-cell em {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-table-wrap .product-cell b,
.catalog-table .product-cell b {
  display: -webkit-box;
  overflow: hidden;
  line-height: 1.38;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.catalog-table-wrap .copy-article,
.catalog-table .copy-article { max-width: 100%; white-space: normal; }
.catalog-table-wrap .row-menu-popover { z-index: 32; }
.catalog-article-cell {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  align-items: flex-start;
  flex-wrap: wrap;
  white-space: normal;
}
.catalog-article-cell b {
  min-width: 0;
  max-width: 100%;
  flex: 1 1 auto;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.35;
}
.catalog-barcode {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: #4d554a;
  font-variant-numeric: tabular-nums;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-wrap-text {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: #4b5447;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-name-cell {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: grid;
  gap: 5px;
}
.catalog-name-cell b {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.4;
}
.catalog-name-cell small {
  min-width: 0;
  max-width: 100%;
  color: var(--muted);
  font-size: 10px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-discount {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
  max-width: 100%;
  min-height: 27px;
  padding: 3px 8px;
  box-sizing: border-box;
  border-radius: 8px;
  background: #fff2e0;
  color: #a26516;
  font-size: 10px;
  font-weight: 850;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-row-actions { position: relative; display: grid; place-items: center; }
.catalog-row-actions > .row-action {
  width: 32px;
  min-width: 32px;
  height: 32px;
  padding: 0;
  border-radius: 9px;
}
.catalog-row-menu {
  position: absolute;
  z-index: 38;
  top: 35px;
  right: 0;
  min-width: 205px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(24,32,21,.17);
}
.catalog-table tbody tr:nth-last-child(-n+2) .catalog-row-menu { top: auto; bottom: 35px; }
.catalog-row-menu button {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 9px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #30392d;
  font-size: 11px;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}
.catalog-row-menu button:hover { background: #f1f6ec; }
.catalog-row-menu span { display: block; padding: 8px; color: var(--muted); font-size: 10px; }
.catalog-row-error-text,
.catalog-missing-fields {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin-top: 5px;
  color: #b84c4c;
  font-size: 9px;
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-table-wrap tbody tr { transition: background .12s ease, box-shadow .12s ease; }
.catalog-table-wrap tbody tr:hover td,
.catalog-table tbody tr:hover td { background: #f6f9f3; }
.catalog-table-wrap tr.catalog-row-selected td,
.catalog-table tr.catalog-row-selected td,
.catalog-row-selected td {
  background: #f2f9e8;
  box-shadow: inset 0 1px 0 #e2efd2, inset 0 -1px 0 #e2efd2;
}
.catalog-table-wrap tr.catalog-row-selected:hover td,
.catalog-table tr.catalog-row-selected:hover td,
.catalog-row-selected:hover td { background: #edf7df; }
.catalog-table-wrap tr.catalog-row-selected td:first-child,
.catalog-table tr.catalog-row-selected td:first-child,
.catalog-row-selected td:first-child {
  box-shadow: inset 3px 0 0 var(--lime-dark), inset 0 1px 0 #e2efd2, inset 0 -1px 0 #e2efd2;
}
.catalog-select-cell {
  display: flex;
  align-items: flex-start;
  gap: 11px;
}
.catalog-select-cell > input,
.catalog-select-all {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin: 11px 0 0;
  accent-color: var(--lime-dark);
}
.catalog-select-all { margin: 0; }

.catalog-sort {
  min-width: 0;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 4px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 800;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
}
.catalog-table th.column-user-sized {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.25;
}
.catalog-table th.column-user-sized .catalog-sort {
  width: 100%;
  flex-wrap: wrap;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-table td.column-user-sized {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-table td.column-user-sized > :is(
  .catalog-article-cell,
  .catalog-barcode,
  .catalog-wrap-text,
  .catalog-name-cell,
  .catalog-markets,
  .catalog-status,
  .catalog-row-error-text,
  .catalog-missing-fields
) {
  min-width: 0;
  max-width: 100%;
}
.catalog-table td.column-user-sized > .money {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-table td.column-user-sized .product-thumb {
  width: min(46px, 100%);
  height: auto;
  aspect-ratio: 1;
}
.catalog-sort:hover { background: #e9eee5; color: #35412f; }
.catalog-sort:focus-visible {
  outline: 2px solid rgba(143,198,45,.35);
  outline-offset: 1px;
}
.catalog-sort.active,
th[aria-sort="ascending"] .catalog-sort,
th[aria-sort="descending"] .catalog-sort { color: #4f7a19; }
.catalog-sort svg { width: 14px; height: 14px; }
.catalog-sort[data-direction="asc"]::after,
.catalog-sort[data-direction="desc"]::after {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background: #e3f3ca;
  color: #4c7916;
  font-size: 12px;
  font-weight: 900;
}
.catalog-sort[data-direction="asc"]::after { content: "↑"; }
.catalog-sort[data-direction="desc"]::after { content: "↓"; }

.catalog-markets {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
  max-width: 166px;
}
.catalog-markets .market-icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  box-shadow: 0 0 0 2px #fff;
  font-size: 10px;
  font-weight: 900;
}
.catalog-market-chip {
  position: relative;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  cursor: help;
}
.catalog-market-chip::after {
  content: attr(data-tooltip);
  position: absolute;
  z-index: 60;
  top: calc(100% + 7px);
  left: 50%;
  width: max-content;
  max-width: 260px;
  padding: 7px 9px;
  border-radius: 8px;
  background: #273124;
  color: #fff;
  box-shadow: 0 10px 28px rgba(20,29,17,.22);
  font-size: 10px;
  font-weight: 750;
  line-height: 1.35;
  white-space: normal;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%, -3px);
  transition: opacity .12s ease, transform .12s ease;
}
.catalog-market-chip:hover::after,
.catalog-market-chip:focus-visible::after {
  opacity: 1;
  transform: translate(-50%, 0);
}
.catalog-market-chip:focus-visible {
  outline: 2px solid var(--lime-dark);
  outline-offset: 2px;
}
.catalog-market-chip.draft .market-icon {
  box-shadow: 0 0 0 2px #e9b854;
}
.catalog-market-chip.error .market-icon {
  box-shadow: 0 0 0 2px #df6969;
}
.catalog-market-chip.archived .market-icon {
  filter: grayscale(.8);
  opacity: .68;
}
.catalog-table th.catalog-markets-column,
.catalog-table td.catalog-markets-column {
  width: 138px;
  min-width: 96px;
  max-width: 180px;
}

.catalog-status {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 27px;
  min-width: 0;
  max-width: 100%;
  padding: 4px 9px;
  border: 1px solid #dfe4dc;
  border-radius: 999px;
  background: #f4f6f2;
  color: #697166;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-status::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #99a294;
}
.catalog-status.active,
.catalog-status.success,
.catalog-status[data-status="active"] { border-color: #cee5ad; background: #eef8df; color: #477315; }
.catalog-status.active::before,
.catalog-status.success::before,
.catalog-status[data-status="active"]::before { background: #73b821; }
.catalog-status.info,
.catalog-status[data-status="submitted"] { border-color: #bddce4; background: #edf8fa; color: #327281; }
.catalog-status.info::before,
.catalog-status[data-status="submitted"]::before { background: #4aa7ba; }
.catalog-status.archived,
.catalog-status.neutral,
.catalog-status[data-status="archived"] { border-color: #e1ddd3; background: #f6f3ec; color: #786e5c; }
.catalog-status.archived::before,
.catalog-status.neutral::before,
.catalog-status[data-status="archived"]::before { background: #a29783; }
.catalog-status.draft,
.catalog-status.warning,
.catalog-status[data-status="draft"] { border-color: #efd8a4; background: #fff7e5; color: #916216; }
.catalog-status.draft::before,
.catalog-status.warning::before,
.catalog-status[data-status="draft"]::before { background: #e2a438; }
.catalog-status.error,
.catalog-status.danger,
.catalog-status[data-status="error"] { border-color: #edc0c0; background: #fff0f0; color: #a84040; }
.catalog-status.error::before,
.catalog-status.danger::before,
.catalog-status[data-status="error"]::before { background: #dc5e5e; }

.catalog-completeness {
  --catalog-completeness-value: 0%;
  --catalog-completeness-color: #e2a148;
  min-width: 126px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.catalog-table td.column-user-sized .catalog-completeness {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
  gap: 4px 6px;
}
.catalog-table td.column-user-sized .catalog-completeness > span:first-child {
  width: auto;
  min-width: 24px;
  flex: 1 1 52px;
}
.catalog-table td.column-user-sized .catalog-completeness > b,
.catalog-table td.column-user-sized .catalog-completeness > small {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-completeness-track,
.catalog-completeness > span:first-child {
  position: relative;
  width: 88px;
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #edf0eb;
  box-shadow: inset 0 0 0 1px rgba(60,76,52,.035);
}
.catalog-completeness-fill,
.catalog-completeness > span:first-child > i {
  display: block;
  width: var(--catalog-completeness-value);
  max-width: 100%;
  height: 100%;
  border-radius: inherit;
  background: var(--catalog-completeness-color);
}
.catalog-completeness > b,
.catalog-completeness > small {
  min-width: 34px;
  color: #6d7569;
  font-size: 10px;
  font-weight: 850;
  font-style: normal;
  white-space: nowrap;
}
.catalog-completeness.complete,
.catalog-completeness.high { --catalog-completeness-color: #79bc2d; }
.catalog-completeness.medium { --catalog-completeness-color: #e5ad49; }
.catalog-completeness.low { --catalog-completeness-color: #df735f; }

.catalog-pager {
  min-height: 62px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 16px;
  border-top: 1px solid var(--line);
  background: #fff;
}
.catalog-toolbar-pager {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.catalog-toolbar-pager > b {
  min-width: 58px;
  color: #4d5649;
  font-size: 11px;
  text-align: center;
  white-space: nowrap;
}
.catalog-toolbar-pager > .ghost-button {
  min-height: 38px;
  padding: 0 10px;
  white-space: nowrap;
}
.catalog-pager-summary-only {
  min-height: 42px;
  padding-top: 8px;
  padding-bottom: 8px;
}
.catalog-pager > span {
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}
.catalog-pager > div {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-left: auto;
}
.catalog-pager > div > b {
  min-width: 66px;
  color: #4d5649;
  font-size: 11px;
  text-align: center;
  white-space: nowrap;
}
.catalog-pager-size,
.catalog-pager-pages,
.catalog-pager-summary {
  display: flex;
  align-items: center;
  gap: 6px;
}
.catalog-pager-size label,
.catalog-pager-summary,
.catalog-pager-total {
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}
.catalog-pager-size select,
.catalog-pager select {
  height: 38px;
  min-width: 76px;
  padding: 0 30px 0 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  outline: 0;
  background: #f8f9f7;
  color: var(--text);
  font-size: 11px;
  font-weight: 750;
}
.catalog-pager-size select:focus,
.catalog-pager select:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px rgba(185,239,89,.18); }
.catalog-pager-pages { margin-left: auto; }
.catalog-pager button,
.catalog-page-button {
  min-width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  color: #596253;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
}
.catalog-pager button:hover:not(:disabled),
.catalog-page-button:hover:not(:disabled) { border-color: #c8e3a0; background: var(--lime-soft); color: #477713; }
.catalog-pager button.active,
.catalog-pager button[aria-current="page"],
.catalog-page-button.active,
.catalog-page-button[aria-current="page"] {
  border-color: var(--lime-dark);
  background: var(--lime);
  color: #26331d;
}
.catalog-pager button:focus-visible,
.catalog-page-button:focus-visible { outline: 2px solid rgba(143,198,45,.32); outline-offset: 1px; }
.catalog-pager-ellipsis {
  min-width: 26px;
  color: #92998f;
  text-align: center;
  font-size: 12px;
}

.catalog-filter-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px 13px;
}
.modal:has(.catalog-filter-grid) { width: min(720px, 100%); }
.catalog-filter-reset { margin-right: auto; }
.catalog-filter-grid > .field,
.catalog-filter-grid > label {
  min-width: 0;
  margin: 0;
}
.catalog-filter-grid > .wide,
.catalog-filter-grid > .full,
.catalog-filter-grid > .catalog-filter-wide,
.catalog-filter-grid > [data-span="full"],
.catalog-filter-grid > fieldset {
  grid-column: 1 / -1;
}
.catalog-filter-grid fieldset {
  min-width: 0;
  margin: 0;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.catalog-filter-grid legend {
  padding: 0 6px;
  color: #596253;
  font-size: 11px;
  font-weight: 850;
}
.catalog-filter-grid input,
.catalog-filter-grid select {
  min-width: 0;
}
.catalog-filter-range {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}
.catalog-filter-range > span { color: var(--muted); font-size: 11px; }
.catalog-range {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 11px 12px 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
}
.catalog-range legend {
  padding: 0 5px;
  color: #596253;
  font-size: 11px;
  font-weight: 800;
}
.catalog-range input {
  width: 100%;
  min-width: 0;
  height: 40px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  outline: 0;
  background: #fff;
}
.catalog-range input:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px rgba(185,239,89,.18); }
.catalog-range > span { color: var(--muted); font-size: 11px; }
.catalog-filter-checks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}
.catalog-filter-checks label {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 10px;
  border: 1px solid #e5e9e2;
  border-radius: 9px;
  background: #fafbf9;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.catalog-filter-checks label:has(input:checked) { border-color: #cce5a7; background: var(--lime-soft); color: #4c751c; }
.catalog-filter-checks input { width: 16px; height: 16px; accent-color: var(--lime-dark); }

.catalog-transfer-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 11px;
  padding: 13px 14px;
  border: 1px solid #dce7d1;
  border-radius: 12px;
  background: #f7fbf2;
  color: #53634b;
  font-size: 11px;
  line-height: 1.5;
}
.catalog-transfer-note > svg,
.catalog-transfer-note > .lucide {
  grid-row: 1 / 3;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  color: #6b9d2b;
}
.catalog-transfer-note b { color: #32432b; font-size: 12px; }
.catalog-transfer-note p { margin: 0; }
.catalog-transfer-note.compact { padding: 10px 11px; }
.catalog-transfer-note.compact > svg,
.catalog-transfer-note.compact > .lucide { width: 18px; height: 18px; }
.catalog-transfer-note.warning { border-color: #edd9aa; background: #fff9e9; color: #80651f; }
.catalog-transfer-note.warning > svg { color: #d69824; }
.catalog-transfer-note.danger { border-color: #edc2c2; background: #fff2f2; color: #9a4444; }
.catalog-transfer-note.danger > svg { color: #d65d5d; }

/* Catalog bulk editor and product transfer views */
.catalog-editor,
.catalog-editor-page,
.catalog-editor-shell {
  min-width: 0;
  display: grid;
  gap: 14px;
}
.modal:has(.catalog-editor),
.modal:has(.catalog-editor-shell),
.modal.catalog-editor-modal { width: min(1180px, 100%); }
.catalog-editor-head {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 15px;
  margin-bottom: 15px;
}
.catalog-editor-title {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}
.catalog-editor-title > .market-icon { width: 36px; height: 36px; border-radius: 11px; }
.catalog-editor-title > div { min-width: 0; }
.catalog-editor-title h1 { margin: 0 0 4px; font-size: 24px; letter-spacing: -.7px; }
.catalog-editor-title p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  overflow-wrap: anywhere;
}
.catalog-editor-header,
.catalog-editor-toolbar,
.catalog-editor-footer,
.catalog-editor-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}
.catalog-editor-header {
  justify-content: space-between;
  padding: 2px 1px;
}
.catalog-editor-header h2,
.catalog-editor-header h3 { margin: 0; font-size: 17px; }
.catalog-editor-header p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.catalog-editor-toolbar {
  min-height: 54px;
  flex-wrap: wrap;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8faf7;
}
.catalog-editor-toolbar .catalog-search { flex: 1 1 270px; }
.catalog-editor-summary {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #64705e;
  font-size: 11px;
}
.catalog-editor-summary b { color: #2f3a2a; }
.catalog-editor-summary.panel {
  display: grid;
  grid-template-columns: minmax(150px, .45fr) minmax(150px, .45fr) minmax(300px, 1.2fr);
  align-items: stretch;
  gap: 10px;
  margin-bottom: 15px;
  padding: 12px;
}
.catalog-editor-summary.panel > div {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 13px;
  border: 1px solid #e5e9e2;
  border-radius: 11px;
  background: #fafbf9;
}
.catalog-editor-summary.panel > div > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}
.catalog-editor-summary.panel > div > b {
  color: #34412f;
  font-size: 19px;
  font-weight: 900;
}
.catalog-editor-summary.panel > .catalog-editor-summary-note {
  justify-content: flex-start;
  background: #f3f9e9;
  color: #587230;
  font-size: 10px;
  line-height: 1.45;
}
.catalog-editor-summary-note > svg { flex: 0 0 auto; color: #6ca223; }
.catalog-editor-actions { margin-left: auto; flex-wrap: wrap; }
.catalog-editor-panel {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
}
.catalog-editor-wrap,
.catalog-editor-table-wrap {
  max-height: min(620px, calc(100vh - 285px));
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #cbd2c7 #f5f7f3;
}
.catalog-editor-table {
  width: max-content;
  min-width: 1120px;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12px;
}
.catalog-editor-table th {
  position: sticky;
  z-index: 8;
  top: 0;
  padding: 11px 13px;
  border-right: 1px solid #e1e5de;
  border-bottom: 1px solid #dfe4dc;
  background: #f5f7f3;
  color: #727a6e;
  text-align: left;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}
.catalog-editor-table td {
  min-width: 130px;
  padding: 10px 13px;
  border-right: 1px solid #edf0eb;
  border-bottom: 1px solid #e8ece5;
  vertical-align: middle;
  white-space: normal;
}
.catalog-editor-table th.column-user-sized,
.catalog-editor-table td.column-user-sized {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-editor-table td.column-user-sized .catalog-editor-field,
.catalog-editor-table td.column-user-sized :is(input, select, textarea) {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.catalog-editor-table td.column-user-sized .catalog-editor-photo {
  width: min(52px, 100%);
  height: auto;
  aspect-ratio: 1;
}
.catalog-editor-table td.column-user-sized .catalog-status,
.catalog-editor-table td.column-user-sized .catalog-row-error-text,
.catalog-editor-table td.column-user-sized .catalog-missing-fields,
.catalog-editor-table td.column-user-sized .catalog-row-save {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-editor-table th:first-child,
.catalog-editor-table td:first-child {
  width: 52px;
  min-width: 52px;
  max-width: 52px;
  text-align: center;
}
.catalog-editor-table th:first-child input,
.catalog-editor-table td:first-child input {
  width: 17px;
  min-width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--lime-dark);
}
.catalog-editor-table th:nth-child(2),
.catalog-editor-table td:nth-child(2) {
  width: 82px;
  min-width: 82px;
  max-width: 82px;
  text-align: center;
}
.catalog-editor-table th:last-child,
.catalog-editor-table td:last-child { border-right: 0; }
.catalog-editor-table tbody tr:hover td { background: #f7f9f5; }
.catalog-editor-table tr.catalog-editor-row-dirty td {
  background: #f5faee;
  box-shadow: inset 0 1px 0 #e4efd8, inset 0 -1px 0 #e4efd8;
}
.catalog-editor-table tr.catalog-editor-row-dirty td:first-child {
  box-shadow: inset 3px 0 0 var(--lime-dark), inset 0 1px 0 #e4efd8, inset 0 -1px 0 #e4efd8;
}
.catalog-editor-table tr.catalog-row-dirty td {
  background: #f5faee;
  box-shadow: inset 0 1px 0 #e4efd8, inset 0 -1px 0 #e4efd8;
}
.catalog-editor-table tr.catalog-row-dirty td:first-child {
  box-shadow: inset 3px 0 0 var(--lime-dark), inset 0 1px 0 #e4efd8, inset 0 -1px 0 #e4efd8;
}
.catalog-editor-table tr.catalog-row-error td { background: #fffafa; }
.catalog-editor-table tr.catalog-row-error td:first-child { box-shadow: inset 3px 0 0 #dc6464; }
.catalog-required-cell {
  position: relative;
  background: #fffaf2 !important;
}
.catalog-required-cell::after {
  content: "";
  position: absolute;
  top: 4px;
  right: 4px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #df9a38;
}
.required-mark { color: #d25858; font-weight: 900; }
.catalog-editor-photo {
  width: 52px;
  height: 52px;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid #e0e5dd;
  border-radius: 10px;
  background: #f3f6f0;
  color: #98a192;
}
.catalog-editor-photo img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.catalog-editor-product {
  min-width: 250px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.catalog-editor-product > div { min-width: 0; display: grid; gap: 4px; }
.catalog-editor-product b,
.catalog-editor-product small {
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}
.catalog-editor-product small { color: var(--muted); font-size: 10px; }
.catalog-editor-market {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #596253;
  font-size: 11px;
  font-weight: 750;
}
.catalog-editor-field {
  min-width: 120px;
  display: grid;
  gap: 5px;
}
.catalog-editor-field small { color: var(--muted); font-size: 9px; }
.catalog-editor-input,
.catalog-editor-table input,
.catalog-editor-table select,
.catalog-editor-table textarea {
  width: 100%;
  min-width: 105px;
  height: 36px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  outline: 0;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 11px;
}
.catalog-editor-table textarea {
  min-width: 210px;
  min-height: 62px;
  height: auto;
  padding-top: 8px;
  resize: vertical;
}
.catalog-barcode-editor {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: grid;
  gap: 6px;
}
.catalog-barcode-editor .catalog-editor-input {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.catalog-barcode-editor.is-auto .catalog-editor-input {
  border-color: #b9d88a;
  background: #f8fced;
}
.catalog-barcode-state {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 5px;
  padding: 4px 7px;
  border: 1px solid #d4e4bb;
  border-radius: 9px;
  background: #f3f9e8;
  color: #5c8428;
  font-size: 9px;
  font-weight: 800;
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-barcode-state svg { flex: 0 0 auto; margin-top: 1px; }
.catalog-barcode-state > span {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-barcode-state.pending svg { animation: none; }
.catalog-barcode-state.success {
  border-color: #bfe0bd;
  background: #eef9ed;
  color: #3e7b3b;
}
.catalog-ozon-column-title {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: normal;
  overflow-wrap: anywhere;
}
.catalog-ozon-column-title svg { color: #7da839; flex: 0 0 auto; }
.catalog-bulk-heading { width: 100%; }
.catalog-bulk-heading > span {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-bulk-heading .catalog-ozon-column-title { max-width: 100%; }
.catalog-bulk-fill-toggle { margin-left: auto; }
.catalog-ozon-attribute {
  min-width: 180px;
  padding: 2px;
  border-radius: 9px;
}
.catalog-ozon-attribute.required-missing {
  background: #fffaf0;
  box-shadow: inset 3px 0 0 #e3a34a;
}
.catalog-wb-category { min-width: 220px; display: grid; gap: 5px; }
.catalog-wb-category > small,
.catalog-wb-characteristic > small {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.catalog-wb-category.required-missing > small { color: #a86e1e; }
.catalog-wb-characteristic {
  min-width: 175px;
  display: grid;
  gap: 5px;
  padding: 2px;
  border-radius: 9px;
}
.catalog-wb-characteristic.required-missing {
  background: #fffaf0;
  box-shadow: inset 3px 0 0 #e3a34a;
}
.catalog-wb-characteristic.required-missing .catalog-editor-input {
  border-color: #e3a34a;
  background: #fffaf0;
}
.catalog-ozon-attribute-picker {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 11px;
  text-align: left;
  cursor: pointer;
}
.catalog-ozon-attribute-picker:hover,
.catalog-ozon-attribute-picker:focus-visible {
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px rgba(185,239,89,.18);
  outline: 0;
}
.catalog-ozon-attribute-picker span {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-ozon-attribute-picker svg { flex: 0 0 auto; color: #779f38; }
.catalog-ozon-schema-warning { margin-bottom: 16px; }
#modalForm:has(.catalog-ozon-picker) { width: min(720px, calc(100vw - 32px)); }
.catalog-ozon-picker { display: grid; gap: 12px; }
.catalog-ozon-picker-description {
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f5f9ed;
  color: #68715f;
  font-size: 12px;
  line-height: 1.5;
}
.catalog-ozon-picker-search {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}
.catalog-ozon-picker-search:focus-within {
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px rgba(185,239,89,.18);
}
.catalog-ozon-picker-search svg { color: #7b866f; flex: 0 0 auto; }
.catalog-ozon-picker-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
}
.catalog-ozon-picker-status { color: var(--muted); font-size: 11px; }
.catalog-ozon-picker-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.catalog-ozon-picker-options {
  max-height: min(420px, 50vh);
  display: grid;
  gap: 6px;
  overflow: auto;
  padding-right: 3px;
}
.catalog-ozon-picker-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 11px;
  border: 1px solid #e1e7dc;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
}
.catalog-ozon-picker-option:hover { border-color: #b9d88a; background: #fbfff6; }
.catalog-ozon-picker-option.selected { border-color: #9fc95d; background: #f3fadf; }
.catalog-ozon-picker-option input { margin-top: 3px; accent-color: #87b83e; }
.catalog-ozon-picker-option img {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 7px;
  object-fit: contain;
  background: #f4f6f2;
}
.catalog-ozon-picker-option span { min-width: 0; display: grid; gap: 3px; }
.catalog-ozon-picker-option b,
.catalog-ozon-picker-option small {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-ozon-picker-option b { font-size: 12px; }
.catalog-ozon-picker-option small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.catalog-ozon-picker-empty {
  padding: 24px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  color: var(--muted);
  text-align: center;
}
.catalog-editor-input:focus,
.catalog-editor-table input:focus,
.catalog-editor-table select:focus,
.catalog-editor-table textarea:focus {
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px rgba(185,239,89,.18);
}
.catalog-editor-input.changed,
.catalog-editor-table input.changed,
.catalog-editor-table select.changed,
.catalog-editor-table textarea.changed { border-color: #a8d666; background: #fbfff5; }
.catalog-editor-input.required-missing {
  border-color: #e3a34a;
  background: #fffaf0;
  box-shadow: inset 3px 0 0 #e3a34a;
}
.catalog-editor-input.required-missing:focus {
  border-color: #d58c29;
  box-shadow: inset 3px 0 0 #d58c29, 0 0 0 3px rgba(227,163,74,.16);
}
.catalog-row-save {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 9px;
  border-radius: 8px;
  white-space: nowrap;
}
.catalog-editor-input[aria-invalid="true"],
.catalog-editor-table input[aria-invalid="true"],
.catalog-editor-table select[aria-invalid="true"],
.catalog-editor-table textarea[aria-invalid="true"] {
  border-color: #df6565;
  background: #fff8f8;
  box-shadow: 0 0 0 3px rgba(223,101,101,.12);
}
.catalog-editor-footer {
  position: sticky;
  z-index: 10;
  bottom: 0;
  justify-content: flex-end;
  flex-wrap: wrap;
  padding: 12px 14px;
  border-top: 1px solid var(--line);
  background: rgba(255,255,255,.96);
  box-shadow: 0 -8px 22px rgba(32,45,27,.05);
  backdrop-filter: blur(8px);
}
.catalog-editor-footer > span,
.catalog-editor-save-note {
  margin-right: auto;
  color: var(--muted);
  font-size: 10px;
}
.catalog-editor-empty {
  min-height: 210px;
  display: grid;
  place-items: center;
  padding: 28px;
  color: var(--muted);
  text-align: center;
  font-size: 12px;
}

@media (max-width: 1180px) {
  .catalog-panel-head { align-items: stretch; flex-direction: column; }
  .catalog-panel-actions { justify-content: flex-start; }
  .catalog-toolbar { flex-wrap: wrap; }
  .catalog-toolbar-main { flex: 1 1 100%; }
  .catalog-toolbar-actions { margin-left: 0; }
  .catalog-search:not(input) { max-width: none; }
  .catalog-table,
  .catalog-table-wrap .data-table { min-width: 1180px; }
  .catalog-editor-summary.panel { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
  .catalog-editor-summary.panel > .catalog-editor-summary-note { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .catalog-account-tabs { margin-right: -2px; margin-left: -2px; }
  .catalog-toolbar-main,
  .catalog-toolbar-actions { flex-wrap: wrap; width: 100%; }
  .catalog-toolbar-actions { flex: 1 1 100%; }
  .catalog-toolbar-actions > button,
  .catalog-toolbar-actions > .ghost-button,
  .catalog-toolbar-actions > .primary-button { flex: 1 1 150px; }
  .catalog-search:not(input),
  input.catalog-search { flex-basis: 100%; width: 100%; min-width: 0; }
  .catalog-toolbar-spacer { display: none; }
  .catalog-page-size { margin-left: auto; }
  .catalog-toolbar-pager { margin-left: 0; }
  .catalog-selection-bar { flex-wrap: wrap; }
  .catalog-selection-bar .link-button:last-child { margin-left: 0; }
  .catalog-filter-grid { grid-template-columns: 1fr; }
  .catalog-filter-grid > .wide,
  .catalog-filter-grid > .full,
  .catalog-filter-grid > .catalog-filter-wide,
  .catalog-filter-grid > [data-span="full"],
  .catalog-filter-grid > fieldset { grid-column: 1; }
  .catalog-pager { flex-wrap: wrap; }
  .catalog-pager-pages { order: 3; width: 100%; margin-left: 0; overflow-x: auto; padding-bottom: 2px; }
  .catalog-pager-summary { margin-left: auto; }
  .catalog-editor-head {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }
  .catalog-editor-head > .catalog-editor-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
  .catalog-editor-header { align-items: flex-start; }
  .catalog-editor-toolbar,
  .catalog-editor-actions { width: 100%; }
  .catalog-editor-actions { margin-left: 0; }
  .catalog-editor-actions > button { flex: 1 1 140px; }
  .catalog-editor-wrap,
  .catalog-editor-table-wrap { max-height: none; }
}

@media (max-width: 640px) {
  .catalog-account-tabs {
    margin-bottom: 10px;
    padding: 4px;
    border-radius: 12px;
  }
  .catalog-account-tabs button,
  .catalog-account-tab { min-height: 38px; padding: 0 11px; font-size: 11px; }
  .catalog-panel { border-radius: 12px; }
  .catalog-panel-head { min-height: 0; padding: 13px 11px; }
  .catalog-panel-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-panel-actions button { width: 100%; white-space: normal; }
  .catalog-toolbar { min-height: 0; padding: 10px; }
  .catalog-toolbar-count,
  .catalog-result-count { width: 100%; }
  .catalog-toolbar-actions > button { flex-basis: 100%; }
  .catalog-page-size { width: 100%; justify-content: space-between; margin-left: 0; }
  .catalog-toolbar-pager {
    width: 100%;
    justify-content: space-between;
  }
  .catalog-selection-bar { padding: 9px 11px; }
  .catalog-selection-bar .link-button { flex: 1 1 auto; text-align: left; }
  .catalog-table-wrap { max-height: none; min-height: 220px; }
  .catalog-table,
  .catalog-table-wrap .data-table { min-width: 1060px; }
  .catalog-table-wrap .data-table td:first-child,
  .catalog-table-wrap .data-table th:first-child,
  .catalog-table td:first-child,
  .catalog-table th:first-child { min-width: 52px; }
  .catalog-table-wrap .product-cell,
  .catalog-table .product-cell { min-width: 235px; max-width: 330px; }
  .catalog-pager { padding: 10px; }
  .catalog-pager > span { width: 100%; }
  .catalog-pager > div { width: 100%; margin-left: 0; justify-content: space-between; }
  .catalog-pager-size,
  .catalog-pager-summary { flex: 1 1 auto; }
  .catalog-pager-summary { justify-content: flex-end; }
  .catalog-filter-checks { grid-template-columns: 1fr; }
  .catalog-filter-range { grid-template-columns: 1fr; }
  .catalog-filter-range > span { display: none; }
  .catalog-range { grid-template-columns: 1fr; }
  .catalog-range > span { display: none; }
  .catalog-transfer-note { padding: 11px; }
  .catalog-editor-head {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .catalog-editor-head > .ghost-button { justify-self: start; }
  .catalog-editor-title { align-items: flex-start; }
  .catalog-editor-title h1 { font-size: 21px; }
  .catalog-editor-head > .catalog-editor-actions {
    grid-column: 1;
    justify-content: stretch;
  }
  .catalog-editor-head > .catalog-editor-actions button { flex: 1 1 100%; }
  .catalog-editor-summary.panel { grid-template-columns: 1fr; }
  .catalog-editor-summary.panel > .catalog-editor-summary-note { grid-column: 1; }
  .catalog-editor-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .catalog-editor-header p { grid-column: 1 / -1; }
  .catalog-editor-toolbar { padding: 9px; }
  .catalog-editor-footer { align-items: stretch; }
  .catalog-editor-footer > span,
  .catalog-editor-save-note { width: 100%; margin: 0 0 3px; }
  .catalog-editor-footer > button { flex: 1 1 130px; }
  .modal:has(.catalog-editor),
  .modal:has(.catalog-editor-shell),
  .modal.catalog-editor-modal { max-height: calc(100vh - 20px); }
}

@media (prefers-reduced-motion: reduce) {
  .catalog-account-tabs button,
  .catalog-account-tab,
  .catalog-search input,
  input.catalog-search,
  .catalog-table-wrap tbody tr { transition: none; }
}

/* Расчёт закупки в Китае */
.china-tabs-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}
.china-tabs-row .china-tabs { margin: 0; }
.china-average-transit {
  display: flex;
  min-height: 46px;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  padding: 6px 11px 6px 7px;
  border: 1px solid #dce8d2;
  border-radius: 12px;
  background: #fff;
}
.china-average-transit > span {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  border-radius: 9px;
  color: #4f7d18;
  background: var(--lime-soft);
}
.china-average-transit > div {
  display: grid;
  min-width: 0;
  grid-template-columns: auto auto;
  align-items: baseline;
  column-gap: 7px;
}
.china-average-transit small {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 8px;
  font-weight: 750;
}
.china-average-transit b {
  color: #416d0d;
  font-size: 13px;
  white-space: nowrap;
}
.china-average-transit em {
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
  white-space: nowrap;
}
.china-draft-top-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.china-draft-top-actions button { white-space: nowrap; }

.china-draft-row-actions,
.china-catalog-row-actions {
  display: flex;
  align-items: center;
  gap: 5px;
}
.china-start-panel {
  min-height: 480px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 54px 30px;
  background:
    radial-gradient(circle at 50% 20%, rgba(185, 239, 89, .18), transparent 34%),
    #fff;
}
.china-start-panel h2 { max-width: 620px; margin: 18px 0 8px; font-size: 30px; letter-spacing: -1px; }
.china-start-panel > p { max-width: 690px; margin: 0 0 24px; color: var(--muted); line-height: 1.65; }
.china-start-illustration {
  position: relative;
  display: grid;
  place-items: center;
  width: 96px;
  height: 96px;
  margin-bottom: 16px;
  border-radius: 29px;
  color: #315313;
  background: linear-gradient(145deg, #dfff9d, var(--lime));
  box-shadow: 0 18px 50px rgba(125, 177, 40, .2);
}
.china-start-illustration > span {
  position: absolute;
  right: -8px;
  bottom: -7px;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 5px solid #fff;
  border-radius: 16px;
  color: #fff;
  background: #243020;
}
.china-start-steps { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 30px; }
.china-start-steps span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 6px 11px 6px 7px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .76);
  color: #586056;
  font-size: 12px;
  font-weight: 700;
}
.china-start-steps b {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 9px;
  color: #3f6912;
  background: var(--lime-soft);
}
.china-order-form { display: flex; flex-direction: column; gap: 16px; }
.china-settings-panel,
.china-lines-panel,
.china-order-summary,
.china-history-panel { padding: 20px; }
.china-settings-panel .panel-heading,
.china-lines-panel .panel-heading,
.china-history-panel .panel-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}
.china-settings-panel .panel-heading h2,
.china-lines-panel .panel-heading h2,
.china-history-panel .panel-heading h2 { margin: 0 0 4px; font-size: 19px; }
.china-settings-panel .panel-heading p,
.china-lines-panel .panel-heading p,
.china-history-panel .panel-heading p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.china-settings-panel .panel-actions,
.china-lines-panel .panel-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.china-frozen-note {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid #dce8cf;
  border-radius: 10px;
  color: #56733b;
  background: #f8fcf3;
  font-size: 11px;
  font-weight: 800;
}
.china-settings-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(155px, 1fr));
  gap: 12px;
}
.china-rate-input,
.china-url-input { display: flex; gap: 7px; min-width: 0; }
.china-rate-input input,
.china-url-input input { min-width: 0; }
.china-rate-input .ghost-button { width: 46px; height: 48px; flex: 0 0 auto; padding: 0; }
.china-url-input .ghost-button { height: 48px; flex: 0 0 auto; white-space: nowrap; }
.china-assumptions {
  display: grid;
  grid-template-columns: minmax(230px, 1.35fr) repeat(4, minmax(115px, 1fr));
  gap: 10px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.china-assumption-title { display: flex; flex-direction: column; justify-content: center; gap: 5px; }
.china-assumption-title b { font-size: 13px; }
.china-assumption-title small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.china-assumptions > label {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 5px;
  padding: 10px;
  border: 1px solid #e5e9e1;
  border-radius: 11px;
  background: #fafbf9;
}
.china-assumptions > label > span {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #676d65;
  font-size: 10px;
  font-weight: 750;
}
.china-assumptions > label > div {
  display: flex;
  min-height: 38px;
  align-items: center;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid #d9e1d4;
  border-radius: 9px;
  background: #fff;
  transition: border-color .16s ease, box-shadow .16s ease;
}
.china-assumptions > label > div:focus-within {
  border-color: #94c94c;
  box-shadow: 0 0 0 3px rgba(168, 219, 91, .2);
}
.china-assumptions input {
  width: 100%;
  min-width: 0;
  height: 30px;
  padding: 0 2px;
  border: 0;
  outline: 0;
  background: #fff;
  font-size: 15px;
  font-weight: 850;
}
.china-assumptions label b,
.china-assumptions label small { flex: 0 0 auto; color: var(--muted); font-size: 9px; }
.china-assumption-help > span::after {
  content: '?';
  display: inline-grid;
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  place-items: center;
  border: 1px solid #b9ce9b;
  border-radius: 50%;
  color: #5e851f;
  background: #f2f9e8;
  font-size: 10px;
  font-weight: 900;
  cursor: help;
}
.china-assumption-help::after {
  content: attr(data-help);
  position: absolute;
  z-index: 30;
  left: 9px;
  right: 9px;
  bottom: calc(100% - 2px);
  padding: 9px 10px;
  border-radius: 9px;
  color: #fff;
  background: #30372d;
  box-shadow: 0 8px 22px rgba(35, 43, 31, .22);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.4;
  pointer-events: none;
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .14s ease, transform .14s ease;
}
.china-assumption-help:hover::after,
.china-assumption-help:focus::after,
.china-assumption-help:focus-within::after {
  opacity: 1;
  transform: translateY(0);
}
.china-lines-empty,
.china-history-empty {
  display: flex;
  min-height: 280px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 35px;
  text-align: center;
  border: 1px dashed #dce2d8;
  border-radius: 15px;
  background: #fafbf9;
}
.china-lines-empty > span,
.china-history-empty > span {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 20px;
  color: #65911e;
  background: var(--lime-soft);
}
.china-lines-empty h3,
.china-history-empty h3 { margin: 15px 0 6px; }
.china-lines-empty p,
.china-history-empty p { max-width: 560px; margin: 0 0 17px; color: var(--muted); line-height: 1.55; }
.china-lines-empty > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; }
.china-draft-table-wrap {
  position: relative;
  max-height: calc(100vh - 250px);
  max-height: clamp(280px, calc(100dvh - 250px), 720px);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  isolation: isolate;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
}
.china-draft-table {
  min-width: 3620px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}
.china-draft-table thead { position: static; }
.china-draft-table thead th {
  position: sticky !important;
  top: 0;
  z-index: 10;
  background: #f8faf7;
  background-clip: padding-box;
  border-bottom: 1px solid #dfe4dc;
  box-shadow: 0 3px 7px rgba(39, 51, 33, .08);
  white-space: normal;
}
.china-draft-table th:first-child,
.china-draft-table td:first-child { width: 270px; min-width: 270px; }
.china-draft-table th:nth-child(2),
.china-draft-table td:nth-child(2) { width: 220px; min-width: 220px; }
.china-draft-table th:nth-child(3),
.china-draft-table td:nth-child(3) { width: 220px; min-width: 220px; }
.china-draft-table th:nth-child(4),
.china-draft-table td:nth-child(4) { width: 240px; min-width: 240px; }
.china-draft-table th:nth-child(5),
.china-draft-table td:nth-child(5) { width: 110px; min-width: 110px; }
.china-draft-table th:last-child,
.china-draft-table td:last-child { width: 84px; min-width: 84px; }
.china-draft-table th,
.china-draft-table td {
  box-sizing: border-box;
  min-width: 126px;
  vertical-align: top;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.china-draft-table td > * { min-width: 0; max-width: 100%; }
.china-draft-table td { line-height: 1.35; }
.china-table-input {
  width: 100%;
  min-width: 0;
  height: 37px;
  padding: 0 9px;
  border: 1px solid #dfe4dc;
  border-radius: 9px;
  outline: none;
  background: #fff;
}
.china-table-input:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px rgba(185,239,89,.2); }
.china-table-input.quantity { font-size: 15px; font-weight: 850; }
.china-table-textarea {
  min-height: 58px;
  height: auto;
  padding-top: 8px;
  padding-bottom: 8px;
  resize: vertical;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.china-buyer-comment-input { min-height: 74px; }
.china-product-cell { align-items: flex-start; }
.china-product-cell > div { min-width: 0; }
.china-product-cell b,
.china-product-cell small,
.china-product-cell a {
  display: block;
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
.china-product-cell a { margin-top: 4px; color: #66952a; font-size: 10px; text-decoration: none; }
.china-autofill-note {
  display: flex;
  align-items: flex-start;
  gap: 4px;
  margin-top: 5px;
  color: #5d871f;
  font-size: 9px;
  font-style: normal;
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
}
.china-autofill-note svg { flex: 0 0 auto; margin-top: 1px; }
.china-product-link-input { position: relative; min-width: 0; }
.china-product-link-input input { padding-right: 35px; }
.china-product-link-input a {
  position: absolute;
  right: 4px;
  top: 4px;
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border-radius: 8px;
  color: #5c8422;
  background: var(--lime-soft);
}
.china-calculated-input { position: relative; display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.china-calculated-input small { color: #788174; font-size: 9px; line-height: 1.25; white-space: normal; }
.china-calculated-input button {
  position: absolute;
  right: 3px;
  top: 3px;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  color: #5e7650;
  background: #eef4e9;
  cursor: pointer;
}
.china-calculated-input:has(button) input { padding-right: 35px; }
.china-order-summary { overflow: hidden; }
.china-summary-grid { display: grid; grid-template-columns: repeat(6, minmax(145px, 1fr)); gap: 9px; }
.china-summary-grid > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 6px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fafbf9;
}
.china-summary-grid > div.total { border-color: #cfe6a9; background: var(--lime-soft); }
.china-summary-grid span { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 10px; font-weight: 750; }
.china-summary-grid span > [data-china-country-route] {
  display: inline;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}
.china-summary-grid b { font-size: 18px; letter-spacing: -.4px; }
.china-summary-grid small { color: var(--muted); font-size: 9px; line-height: 1.35; }
.china-product-modal-search { max-width: none !important; margin-bottom: 12px; }
.china-product-picker-list {
  display: flex;
  max-height: min(52vh, 520px);
  flex-direction: column;
  gap: 5px;
  overflow: auto;
  padding-right: 3px;
}
.china-product-picker-option {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  min-height: 64px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}
.china-product-picker-option:hover,
.china-product-picker-option:has(input:checked) { border-color: #b8d985; background: #f7fbea; }
.china-product-picker-option > span { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.china-product-picker-option b,
.china-product-picker-option small { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.china-product-picker-option small { color: var(--muted); }
.china-product-picker-option .china-picker-autofill {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #5b851e;
  font-size: 9px;
}
.china-product-picker-option > em { display: flex; gap: 4px; font-style: normal; }
.china-1688-import { margin-bottom: 15px; }
.china-product-images-upload {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fafcf8;
}
.china-product-images-upload > div:first-child {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}
.china-product-images-upload > div:first-child b { font-size: 13px; }
.china-product-images-upload > div:first-child small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}
.china-product-images-button {
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
}
.china-product-images-button input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.china-product-images-upload > p {
  grid-column: 1 / -1;
  margin: 2px 0 0;
  padding: 15px;
  border: 1px dashed #cdd7c7;
  border-radius: 11px;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}
.china-product-images-preview {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
  gap: 9px;
}
.china-product-image-preview {
  position: relative;
  min-height: 104px;
  margin: 0;
  overflow: hidden;
  border: 1px solid #d8e2d2;
  border-radius: 11px;
  background: #fff;
}
.china-product-image-preview img {
  display: block;
  width: 100%;
  height: 104px;
  object-fit: contain;
  background: #fff;
}
.china-product-image-preview > span {
  position: absolute;
  left: 6px;
  bottom: 6px;
  padding: 3px 6px;
  border-radius: 999px;
  color: #355b0d;
  background: rgba(221,245,167,.94);
  font-size: 8px;
  font-weight: 850;
}
.china-product-image-preview > button {
  position: absolute;
  top: 5px;
  right: 5px;
  display: grid;
  width: 25px;
  height: 25px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(183,67,67,.2);
  border-radius: 50%;
  color: #9f3333;
  background: rgba(255,255,255,.94);
  cursor: pointer;
}
.china-product-image-preview > button:hover { background: #fff0f0; }
.china-import-state {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 68px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #dbe7d0;
  border-radius: 12px;
  background: #f8fcf4;
}
.china-import-state.error { border-color: #f1cdcd; background: #fff6f6; }
.china-import-state img { width: 52px; height: 52px; border-radius: 10px; object-fit: cover; }
.china-import-state > div,
.china-import-state > p { display: flex; min-width: 0; flex-direction: column; gap: 4px; margin: 0; }
.china-import-state small { color: var(--muted); white-space: normal; overflow-wrap: anywhere; }
.china-status {
  display: inline-flex;
  width: max-content;
  max-width: 190px;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid #dfe3dc;
  border-radius: 10px;
  background: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
  white-space: normal;
}
.china-status.china { border-color: #f4c784; color: #995e09; background: #fff3df; }
.china-status.russia { border-color: #c9c8f6; color: #5753a8; background: #f0efff; }
.china-status.local { border-color: #a8dfd2; color: #19745f; background: #e9faf6; }
.china-status.partial { border-color: #f0b9b9; color: #b43e3e; background: #fff0f0; }
.china-status.complete { border-color: #b8dc82; color: #497a0c; background: #effbd9; }
.china-history-kpis { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.china-history-kpis article {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 86px;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #fff;
  box-shadow: var(--shadow);
}
.china-history-kpis article > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 13px;
  color: #4a7118;
  background: var(--lime-soft);
}
.china-history-kpis article > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.china-history-kpis small { color: var(--muted); font-size: 10px; }
.china-history-kpis b { font-size: 19px; white-space: normal; overflow-wrap: anywhere; }
.china-history-toolbar { align-items: center !important; }
.china-history-toolbar > div:first-child { margin-right: auto; }
.china-history-toolbar .catalog-search { width: min(360px, 100%); }
.china-history-toolbar .toolbar-select { min-width: 210px; }
.china-history-table-wrap { max-height: calc(100vh - 320px); border: 1px solid var(--line); border-radius: 13px; }
.china-history-table { min-width: 1180px; }
.china-active-orders .china-history-table { min-width: 1460px; }
.china-history-table > thead th { position: sticky; top: 0; z-index: 7; background: #f8faf7; }
.china-history-table th,
.china-history-table td { white-space: normal; overflow-wrap: anywhere; }
.china-history-table th:first-child,
.china-history-table td:first-child { min-width: 220px; }
.china-history-table th:last-child,
.china-history-table td:last-child { min-width: 330px; }
.china-order-row:hover td { background: #fbfdf8; }
.china-order-toggle { display: flex; width: 100%; min-width: 0; align-items: center; gap: 8px; padding: 0; border: 0; background: transparent; cursor: pointer; text-align: left; }
.china-order-toggle > span { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.china-order-toggle b,
.china-order-toggle small { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.china-order-toggle small { color: var(--muted); }
.china-order-link-cell { display: flex; min-width: 0; flex-direction: column; gap: 5px; }
.china-order-link-cell > b { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.china-order-number-link {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  color: #527c1f;
  background: transparent;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}
.china-order-number-link:hover { color: #365d08; text-decoration: underline; }
.china-order-actions { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.china-order-actions .row-action { flex: 0 0 auto; }
.china-order-delete-button {
  display: grid !important;
  width: 32px;
  height: 32px;
  padding: 0;
  place-items: center;
  border: 1px solid #f0c1c1;
  border-radius: 9px;
  color: #bd4444 !important;
  background: #fff1f1 !important;
}
.china-order-delete-button:hover:not(:disabled) {
  border-color: #dc8f8f;
  color: #9f2828 !important;
  background: #ffe2e2 !important;
}
.china-order-delete-button:focus-visible {
  outline: 2px solid rgba(189, 68, 68, .28);
  outline-offset: 2px;
}
.china-order-delete-button:disabled { cursor: wait; opacity: .65; }
.china-order-delete-button.is-loading svg,
.china-order-delete-confirm[aria-busy="true"] svg { animation: spin .8s linear infinite; }
.china-order-delete-confirm { display: inline-flex; align-items: center; gap: 7px; }
.china-order-delete-modal { width: min(560px, 100%); }
.china-order-delete-notice b,
.china-order-delete-notice p { overflow-wrap: anywhere; }
.china-export-links {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid #dfe5da;
  border-radius: 10px;
  background: #f8faf6;
}
.china-export-links button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 28px;
  padding: 0 7px;
  border: 0;
  border-radius: 7px;
  color: #4f5d46;
  background: transparent;
  font-size: 10px;
  font-weight: 750;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
}
.china-export-links button:hover:not(:disabled) {
  color: #395f0a;
  background: var(--lime-soft);
}
.china-export-links button:disabled {
  cursor: wait;
  opacity: .48;
}
.china-export-links button.is-loading {
  min-width: 88px;
  color: #395f0a;
  background: var(--lime-soft);
  opacity: 1;
}
.china-export-links button.is-loading svg { animation: spin .8s linear infinite; }
.china-product-chinese {
  margin-top: 3px;
  color: #53614b !important;
}
.china-history-product-link {
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  margin-top: 5px;
  color: #5f8d20 !important;
  font-weight: 700;
  text-decoration: none;
}
#chinaHeaderStartOrder,
#chinaHistoryNewOrder { flex: 0 0 auto; white-space: nowrap; }
.china-active-orders { margin-top: 16px; }
.china-order-detail-row > td { padding: 0 !important; background: #f8faf7; }
.china-order-detail { padding: 17px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.china-order-page { padding: 18px; }
.china-order-page-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 13px;
  margin-bottom: 15px;
}
#chinaPurchaseTabs .china-orders-back-tab {
  min-height: 40px;
  padding: 0 15px;
  border: 1px solid #add36d;
  color: #3f6f09;
  background: linear-gradient(145deg, #f5ffe6, #e7f7cb);
  box-shadow: 0 4px 12px rgba(91, 134, 35, .13);
  font-weight: 850;
}
#chinaPurchaseTabs.china-tabs-back-only {
  padding: 0;
  border: 0;
  background: transparent;
}
#chinaPurchaseTabs .china-orders-back-tab:hover {
  border-color: #87bd39;
  color: #315b03;
  background: var(--lime);
  box-shadow: 0 5px 14px rgba(91, 134, 35, .2);
}
.china-order-page-title {
  display: flex;
  min-width: 240px;
  flex: 1 1 360px;
  align-items: center;
  gap: 11px;
}
.china-order-page-title > div { min-width: 0; }
.china-order-page-title h2 {
  margin: 0 0 3px;
  font-size: 20px;
  white-space: normal;
  overflow-wrap: anywhere;
}
.china-order-page-title small { color: var(--muted); font-weight: 750; }
.china-order-page-heading > .china-order-actions { margin-left: auto; }
.china-order-page-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(125px, 1fr));
  gap: 9px;
  margin-bottom: 15px;
}
.china-order-page-kpis > div {
  display: flex;
  min-width: 0;
  min-height: 70px;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 11px;
  border: 1px solid #e1e7dc;
  border-radius: 11px;
  background: #f9fbf7;
}
.china-order-page-kpis small,
.china-order-page-kpis span { color: var(--muted); font-size: 9px; }
.china-order-page-kpis b { font-size: 13px; white-space: normal; overflow-wrap: anywhere; }
.china-order-rate-kpi { align-items: flex-start; }
.china-order-rate-kpi .china-rate-kpi-edit {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 3px;
  min-height: 27px;
  padding: 5px 8px;
  border: 1px solid #c9dbad;
  border-radius: 8px;
  color: #4f741e;
  background: #f1f9e3;
  font: inherit;
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
}
.china-order-rate-kpi .china-rate-kpi-edit:hover {
  border-color: #a7ca6f;
  background: #e8f6d0;
}
.china-exchange-rate-edit { display: flex; flex-direction: column; gap: 15px; }
.china-exchange-rate-edit > p { margin: 0; color: var(--muted); line-height: 1.55; }
.china-exchange-rate-current {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px;
  border: 1px solid #d9e8c0;
  border-radius: 12px;
  background: #f5faec;
}
.china-exchange-rate-current > span {
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  color: #507c19;
  background: #def3b5;
}
.china-exchange-rate-current > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.china-exchange-rate-current small { color: var(--muted); }
.china-exchange-rate-current b { white-space: normal; overflow-wrap: anywhere; }
.china-order-calculation-rates {
  display: grid;
  grid-template-columns: minmax(230px, 1.35fr) repeat(2, minmax(150px, .8fr)) auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 15px;
  padding: 11px;
  border: 1px solid #d9e8c0;
  border-radius: 13px;
  background: linear-gradient(135deg, #fbfef7, #f5faec);
}
.china-order-calculation-rates-title {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
}
.china-order-calculation-rates-title > span,
.china-calculation-rates-current > span {
  display: grid;
  place-items: center;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  color: #507c19;
  background: #def3b5;
}
.china-order-calculation-rates-title > div,
.china-calculation-rate-value {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}
.china-order-calculation-rates-title b,
.china-calculation-rate-value b { font-size: 13px; }
.china-order-calculation-rates-title small,
.china-calculation-rate-value small,
.china-calculation-rate-value span {
  color: var(--muted);
  font-size: 9px;
  white-space: normal;
  overflow-wrap: anywhere;
}
.china-calculation-rates-edit-button {
  border-color: #b9d68e;
  color: #406c0e;
  background: #eff8df;
  white-space: nowrap;
}
.china-calculation-rates-edit-button:hover {
  border-color: #91bf4e;
  background: #e4f4c9;
}
.china-calculation-rates-edit { display: flex; flex-direction: column; gap: 15px; }
.china-calculation-rates-edit > p { margin: 0; color: var(--muted); line-height: 1.55; }
.china-calculation-rates-current {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px;
  border: 1px solid #d9e8c0;
  border-radius: 12px;
  background: #f5faec;
}
.china-calculation-rates-current > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.china-calculation-rates-current small { color: var(--muted); }
.china-calculation-rates-current b { white-space: normal; overflow-wrap: anywhere; }
.china-calculation-rates-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.china-calculation-rates-fields .field { min-width: 0; }
.china-calculation-rates-note {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  padding: 10px 12px;
  border-radius: 10px;
  color: #53644a;
  background: #f3f6f0;
  font-size: 11px;
  line-height: 1.45;
}
.china-calculation-rates-note svg { flex: 0 0 auto; margin-top: 1px; }
.china-order-page > .china-order-detail { padding: 0; border: 0; }

.china-catalog-images {
  display: flex;
  align-items: center;
  gap: 7px;
}
.china-catalog-images > span {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
}
.china-catalog-table td {
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
}
.catalog-table-wrap .china-catalog-table th:first-child,
.catalog-table-wrap .china-catalog-table td:first-child,
.china-catalog-table th:first-child,
.china-catalog-table td:first-child {
  width: 112px;
  min-width: 112px;
  max-width: none;
  text-align: left;
}
.china-catalog-table th:first-child .column-resizer { display: block; }
.china-catalog-table th:nth-child(3),
.china-catalog-table td:nth-child(3) { min-width: 220px; }
.china-catalog-table th:nth-child(4),
.china-catalog-table td:nth-child(4) { min-width: 180px; }
.china-catalog-table th:nth-child(5),
.china-catalog-table td:nth-child(5) { min-width: 150px; }
.china-timeline {
  display: grid;
  grid-template-columns: repeat(5, minmax(190px, 260px));
  justify-content: start;
  gap: 8px;
  margin-bottom: 15px;
}
.china-timeline > div {
  position: relative;
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
  min-height: 62px;
  padding: 9px;
  border: 1px solid #e1e5de;
  border-radius: 12px;
  background: #fff;
}
.china-timeline > div > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  border-radius: 9px;
  color: #7b8279;
  background: #eef1ec;
  font-size: 11px;
  font-weight: 850;
}
.china-timeline > div.completed > span { color: #3f6f09; background: var(--lime); }
.china-timeline > div > div { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; }
.china-timeline b,
.china-timeline small { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.china-timeline b { font-size: 11px; }
.china-timeline small { color: var(--muted); font-size: 9px; }
.china-timeline .china-stage-duration {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  border-radius: 7px;
  color: #456f10;
  background: var(--lime-soft);
  font-size: 9px;
  line-height: 1.3;
}
.china-timeline .china-stage-stat-note {
  color: #728069;
  font-size: 8px;
  font-style: normal;
  line-height: 1.35;
}
.china-timeline > div.editable-date > div { padding-right: 24px; }
.china-stage-edit-button {
  position: absolute;
  top: 7px;
  right: 7px;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 1px solid #dce4d7;
  border-radius: 7px;
  color: #527c1f;
  background: #f7faf4;
  cursor: pointer;
}
.china-stage-edit-button:hover {
  border-color: #b9d68e;
  color: #3f6f09;
  background: var(--lime-soft);
}
.china-timeline-total .china-stage-duration {
  padding: 4px 8px;
  font-size: 13px;
  font-weight: 850;
}
.china-timeline .ghost-button { height: 31px; padding: 0 9px; font-size: 10px; }
.china-current-delivery {
  display: grid;
  grid-template-columns: minmax(210px, 1.45fr) repeat(4, minmax(125px, .7fr)) auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 15px;
  padding: 11px;
  border: 1px solid #dfe7d8;
  border-radius: 13px;
  background: #fff;
}
.china-current-delivery > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}
.china-current-delivery > div > small { color: var(--muted); font-size: 9px; }
.china-current-delivery > div > b { font-size: 12px; white-space: normal; overflow-wrap: anywhere; }
.china-current-delivery-title { flex-direction: row !important; align-items: center; gap: 9px !important; }
.china-current-delivery-title > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border-radius: 10px;
  color: #527c1f;
  background: var(--lime-soft);
}
.china-current-delivery-title > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.china-current-delivery-title b { font-size: 12px; }
.china-current-delivery-title small { color: var(--muted); font-size: 9px; white-space: normal; }
.china-current-delivery-total {
  padding-left: 10px;
  border-left: 1px solid var(--line);
}
.china-current-delivery .ghost-button { white-space: nowrap; }
.china-delivery-edit > p { margin: 0 0 13px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.china-delivery-order-totals {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 13px;
  padding: 12px;
  border: 1px solid #dfe7d8;
  border-radius: 12px;
  background: #f8fbf5;
}
.china-delivery-order-totals input {
  width: 100%;
  min-width: 0;
  height: 38px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  outline: none;
}
.china-delivery-order-totals input:focus {
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px rgba(185,239,89,.2);
}
.china-delivery-edit-table-wrap {
  max-height: min(52vh, 480px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.china-delivery-edit-table { min-width: 820px; }
.china-delivery-edit-table thead th { position: sticky; top: 0; z-index: 2; background: #f8faf7; }
.china-delivery-edit-table td { vertical-align: top; }
.china-delivery-edit-table td:first-child { min-width: 210px; }
.china-delivery-edit-table td:first-child b,
.china-delivery-edit-table td:first-child small { display: block; white-space: normal; overflow-wrap: anywhere; }
.china-delivery-edit-table td:first-child small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.china-delivery-edit-table label { display: flex; min-width: 145px; flex-direction: column; gap: 4px; }
.china-delivery-edit-table input {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  outline: none;
}
.china-delivery-edit-table input:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px rgba(185,239,89,.2); }
.china-delivery-edit-table label small { color: var(--muted); font-size: 9px; }
.china-delivery-edit-table tfoot th { position: sticky; bottom: 0; background: #f1f8e8; }
.china-delivery-edit-note {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 10px;
}
.china-order-items-wrap { max-height: 470px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.china-order-detail > .generated-table-toolbar {
  min-height: 38px;
  padding: 0 2px 8px;
  border-bottom: 0;
}
.china-order-detail > .generated-table-toolbar h2 { font-size: 12px; }
.china-order-detail > .generated-table-toolbar .table-column-button {
  width: 32px;
  height: 32px;
  border-radius: 9px;
}
.china-order-items-table {
  min-width: 2570px;
  table-layout: fixed;
}
.china-order-items-table th { position: sticky; top: 0; z-index: 5; background: #f8faf7; }
.china-order-items-table th,
.china-order-items-table td {
  box-sizing: border-box;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  vertical-align: top;
}
.china-order-items-table th.sortable-th > button {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.china-order-items-table td > * {
  min-width: 0;
  max-width: 100%;
}
.china-order-items-table td :is(b, strong, small, em, a, p) {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.china-order-items-table .product-cell,
.china-order-items-table .product-cell > div {
  min-width: 0;
  max-width: 100%;
}
.china-order-items-table .product-cell { align-items: flex-start; }
.china-order-items-table .china-history-product-link { flex-wrap: wrap; }
.china-item-buyer-comment {
  display: flex;
  min-width: 0;
  max-width: 100%;
  align-items: flex-start;
  gap: 7px;
}
.china-item-buyer-comment p {
  min-width: 0;
  flex: 1;
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.4;
}
.china-item-buyer-comment p.empty { color: var(--muted); }
.china-item-buyer-comment .row-action {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
}
.china-order-items-total td {
  border-top: 2px solid #b7d57d;
  background: #f1f8e8;
  color: #33451e;
  font-weight: 750;
}
.china-order-items-total td:first-child b,
.china-order-items-total td:first-child small { display: block; }
.china-order-items-total td:first-child small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.china-order-items-table .china-order-items-total:hover td { background: #eaf5dc; }
.china-receipt-control { display: grid; min-width: 150px; grid-template-columns: minmax(0, 1fr) 34px; gap: 5px; }
.china-receipt-control input { min-width: 0; height: 34px; padding: 0 8px; border: 1px solid var(--line); border-radius: 9px; outline: none; }
.china-receipt-control input:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px rgba(185,239,89,.2); }
.china-receipt-control button {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 9px;
  background: var(--lime);
  cursor: pointer;
}
.china-receipt-control small { grid-column: 1 / -1; color: var(--muted); font-size: 9px; white-space: normal; }
.china-checks { display: flex; min-width: 130px; flex-direction: column; gap: 7px; }
.china-checks label { display: flex; align-items: center; gap: 6px; font-size: 10px; cursor: pointer; }
.china-stage-modal { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; }
.china-stage-modal > p { margin: 4px 0 10px; color: var(--muted); line-height: 1.55; }
.china-stage-modal > .field { grid-column: 1 / -1; }
.china-stage-modal-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  color: #527c1f;
  background: var(--lime-soft);
}

@media (max-width: 1280px) {
  .china-settings-grid { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
  .china-assumptions { grid-template-columns: repeat(4, minmax(120px, 1fr)); }
  .china-assumption-title { grid-column: 1 / -1; }
  .china-summary-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
  .china-order-page-kpis { grid-template-columns: repeat(3, minmax(135px, 1fr)); }
  .china-order-calculation-rates { grid-template-columns: minmax(220px, 1.2fr) repeat(2, minmax(140px, .8fr)); }
  .china-calculation-rates-edit-button { grid-column: 1 / -1; justify-self: end; }
}

@media (max-width: 920px) {
  .china-settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .china-assumptions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .china-history-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .china-history-toolbar { flex-wrap: wrap; }
  .china-history-toolbar > div:first-child { width: 100%; }
  .china-history-toolbar .catalog-search,
  .china-history-toolbar .toolbar-select { flex: 1 1 230px; width: auto; }
  .china-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .china-current-delivery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .china-current-delivery-title { grid-column: 1 / -1; }
  .china-current-delivery-total { padding-left: 0; border-left: 0; }
  .china-order-calculation-rates { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .china-order-calculation-rates-title { grid-column: 1 / -1; }
  .china-calculation-rates-edit-button { justify-self: stretch; justify-content: center; }
  .china-delivery-order-totals { grid-template-columns: 1fr; }
  .china-order-page-heading > .china-order-actions { width: 100%; margin-left: 0; flex-wrap: wrap; }
}

@media (max-width: 620px) {
  .china-start-panel { min-height: 390px; padding: 38px 18px; }
  .china-start-panel h2 { font-size: 24px; }
  .china-settings-panel,
  .china-lines-panel,
  .china-order-summary,
  .china-history-panel { padding: 14px; }
  .china-settings-panel .panel-heading,
  .china-lines-panel .panel-heading { flex-direction: column; }
  .china-settings-grid,
  .china-assumptions,
  .china-summary-grid,
  .china-history-kpis,
  .china-timeline,
  .china-current-delivery { grid-template-columns: 1fr; }
  .china-lines-panel .panel-actions { width: 100%; }
  .china-lines-panel .panel-actions button { flex: 1 1 150px; }
  .china-product-images-upload { grid-template-columns: 1fr; }
  .china-product-images-button { width: 100%; justify-content: center; }
  .china-tabs-row { flex-wrap: wrap; }
  .china-tabs { display: flex; width: 100%; overflow-x: auto; }
  .china-tabs button { flex: 1 0 max-content; justify-content: center; }
  .china-average-transit { width: 100%; }
  .china-draft-top-actions { width: 100%; }
  .china-draft-top-actions button { flex: 1 1 140px; }
  .china-order-page { padding: 14px; }
  .china-order-page-kpis { grid-template-columns: 1fr; }
  .china-order-calculation-rates,
  .china-calculation-rates-fields { grid-template-columns: 1fr; }
  .china-order-calculation-rates-title { grid-column: auto; }
  .china-calculation-rates-edit-button { grid-column: auto; }
  .china-order-page-title { min-width: 0; flex-basis: 100%; }
}

/* Order geography map */
.order-map-filters .order-map-market-filter summary { min-width: 174px; }
.order-map-filters .product-picker-tools {
  flex: 1 1 360px;
  min-width: min(360px, 100%);
}
.order-map-filters .product-picker-tools .unit-product-filter {
  width: 100%;
  max-width: 680px;
}
.order-map-pending {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: -5px 0 16px;
  padding: 12px 14px;
  border: 1px solid #dce9cb;
  border-radius: 13px;
  background: #f7fcef;
  color: #4d6633;
}
.order-map-pending .spinner { flex: 0 0 auto; width: 22px; height: 22px; border-width: 2px; }
.order-map-pending div { display: grid; gap: 3px; }
.order-map-pending b { color: #34482a; font-size: 12px; }
.order-map-pending small { color: #708064; font-size: 10px; line-height: 1.4; }
.order-map-panel {
  margin-bottom: 16px;
  padding: 0;
  overflow: hidden;
}
.order-map-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 15px 18px;
  border-bottom: 1px solid var(--line);
}
.order-map-panel-head > div:first-child { min-width: 0; }
.order-map-panel-head h2 { margin: 0 0 4px; font-size: 16px; }
.order-map-panel-head > div:first-child small { color: var(--muted); font-size: 10px; }
.order-map-panel.collapsed .order-map-panel-head { border-bottom: 0; }
.order-map-head-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
.order-map-summary { display: flex; align-items: stretch; gap: 7px; }
.order-map-summary > span {
  min-width: 108px;
  display: grid;
  gap: 3px;
  padding: 8px 11px;
  border: 1px solid #e5ebdf;
  border-radius: 10px;
  background: #f8faf5;
}
.order-map-summary small { color: var(--muted); font-size: 9px; }
.order-map-summary b { color: #384532; font-size: 12px; white-space: nowrap; }
.order-map-collapse-button {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid #dfe6d8;
  border-radius: 11px;
  background: #f8faf5;
  color: #638934;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
}
.order-map-collapse-button:hover {
  border-color: #b8d68d;
  background: #eef8df;
  transform: translateY(-1px);
}
.order-map-collapse-button:focus-visible {
  outline: 3px solid rgba(153, 205, 75, .3);
  outline-offset: 2px;
}
.order-map-canvas {
  position: relative;
  z-index: 0;
  width: 100%;
  height: min(62vh, 620px);
  min-height: 420px;
  overflow: hidden;
  background: #eef2ea;
}
.order-map-canvas .ol-viewport,
.order-map-canvas .ol-control { font-family: inherit; }
.order-map-canvas .ol-zoom {
  top: 14px;
  left: 14px;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(214, 225, 204, .96);
  border-radius: 11px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 7px 20px rgba(31, 44, 26, .14);
}
.order-map-canvas .ol-zoom button {
  width: 36px;
  height: 36px;
  margin: 0;
  border-radius: 0;
  background: transparent;
  color: #4e7131;
  font-size: 21px;
}
.order-map-canvas .ol-zoom button + button { border-top: 1px solid #e3eadc; }
.order-map-canvas .ol-zoom button:hover,
.order-map-canvas .ol-zoom button:focus { background: #eef8df; color: #315516; }
.order-map-canvas .ol-attribution {
  right: 8px;
  bottom: 8px;
  max-width: calc(100% - 16px);
  padding: 4px 7px;
  border: 1px solid rgba(220, 228, 213, .92);
  border-radius: 7px;
  background: rgba(255, 255, 255, .9);
  color: #65715f;
  font-size: 9px;
  line-height: 1.25;
}
.order-map-canvas .ol-attribution ul { margin: 0; }
.order-map-canvas .ol-attribution a { color: #577b35; text-decoration: none; }
.order-map-empty {
  position: absolute;
  z-index: 800;
  inset: 50% auto auto 50%;
  width: min(410px, calc(100% - 36px));
  display: grid;
  justify-items: center;
  gap: 7px;
  padding: 22px 24px;
  border: 1px solid rgba(218, 228, 207, .94);
  border-radius: 15px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 18px 45px rgba(34, 48, 28, .12);
  color: #6c7864;
  text-align: center;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.order-map-empty > svg { color: #83ad4d; }
.order-map-empty b { color: #35422f; font-size: 14px; }
.order-map-empty span { font-size: 11px; line-height: 1.5; }
.order-map-ol-popup {
  position: relative;
  width: min(340px, calc(100vw - 52px));
  min-width: min(260px, calc(100vw - 52px));
  padding: 14px 15px;
  border: 1px solid #e0e8d8;
  border-radius: 14px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 17px 42px rgba(25, 35, 21, .2);
}
.order-map-ol-popup::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -8px;
  width: 14px;
  height: 14px;
  border-right: 1px solid #e0e8d8;
  border-bottom: 1px solid #e0e8d8;
  background: #fff;
  transform: translateX(-50%) rotate(45deg);
}
.order-map-ol-popup-close {
  position: absolute;
  z-index: 2;
  top: 6px;
  right: 7px;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #77816f;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.order-map-ol-popup-close:hover { background: #eef8df; color: #4e7131; }
.order-map-ol-tooltip {
  max-width: min(320px, calc(100vw - 36px));
  padding: 7px 10px;
  border: 1px solid rgba(214, 225, 204, .96);
  border-radius: 9px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 8px 24px rgba(31, 44, 26, .16);
  color: #3d4a36;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  pointer-events: none;
}
.order-map-popup { display: grid; gap: 4px; min-width: 230px; color: var(--text); }
.order-map-popup > strong { padding-right: 18px; font-size: 15px; line-height: 1.3; overflow-wrap: anywhere; }
.order-map-popup > small { color: var(--muted); font-size: 10px; line-height: 1.4; overflow-wrap: anywhere; }
.order-map-popup-total {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin-top: 7px;
}
.order-map-popup-total > span {
  min-width: 0;
  display: grid;
  gap: 2px;
  padding: 8px;
  border-radius: 9px;
  background: #f4f8ef;
}
.order-map-popup-total b { overflow-wrap: anywhere; font-size: 11px; }
.order-map-popup-total small { color: var(--muted); font-size: 8px; line-height: 1.25; }
.order-map-popup-markets {
  display: grid;
  gap: 5px;
  margin-top: 5px;
  padding-top: 7px;
  border-top: 1px solid var(--line);
}
.order-map-popup-markets > div { display: flex; align-items: center; gap: 8px; }
.order-map-popup-markets .market-icon { width: 23px; height: 23px; border-radius: 7px; font-size: 9px; }
.order-map-popup-markets span { min-width: 0; display: grid; gap: 1px; }
.order-map-popup-markets b { font-size: 10px; }
.order-map-popup-markets small { color: var(--muted); font-size: 8px; }
.order-map-table-wrap {
  max-height: min(55vh, 620px);
  overflow: auto;
  overscroll-behavior: contain;
}
.order-map-table { min-width: 1180px; }
.order-map-table th { top: 0; z-index: 6; box-shadow: 0 1px 0 #dfe3dc; }
.order-map-table [data-column-id="marketplace"] { min-width: 190px; }
.order-map-table [data-column-id="productName"] { min-width: 300px; }
.order-map-table [data-column-id="country"] { min-width: 145px; }
.order-map-table [data-column-id="region"] { min-width: 190px; }
.order-map-table [data-column-id="city"] { min-width: 165px; }
.order-map-table td[data-column-id="marketplace"],
.order-map-table td[data-column-id="productName"],
.order-map-table td[data-column-id="country"],
.order-map-table td[data-column-id="region"],
.order-map-table td[data-column-id="city"] {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.4;
}
.order-map-marketplace-cell { display: flex; align-items: center; gap: 9px; min-width: 0; }
.order-map-marketplace-cell > span { min-width: 0; display: grid; gap: 3px; }
.order-map-marketplace-cell b,
.order-map-marketplace-cell small {
  display: block;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.order-map-marketplace-cell b { font-size: 11px; }
.order-map-marketplace-cell small { color: var(--muted); font-size: 9px; }
.order-map-product-cell { min-width: 0; display: grid; justify-items: start; gap: 5px; }
.order-map-product-cell > b {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.4;
}
.order-map-product-cell > small { color: var(--muted); font-size: 9px; }

@media (max-width: 960px) {
  .order-map-panel-head { align-items: flex-start; flex-direction: column; }
  .order-map-head-actions { width: 100%; }
  .order-map-summary { width: 100%; }
  .order-map-summary > span { min-width: 0; flex: 1; }
}

@media (max-width: 640px) {
  .order-map-filters .product-picker-tools { min-width: 100%; }
  .order-map-panel-head { padding: 13px; }
  .order-map-summary { display: grid; grid-template-columns: 1fr; }
  .order-map-canvas { height: 54vh; min-height: 320px; }
  .order-map-popup-total { grid-template-columns: 1fr; }
}

/* Shared responsive overflow guards */
#pageContent,
.page-header,
.page-title,
.page-actions,
.filters,
.filters > *,
.panel,
.panel-header,
.panel-header > *,
.table-toolbar,
.table-toolbar > * { min-width: 0; }

.page-header,
.page-actions,
.panel-header,
.table-toolbar { flex-wrap: wrap; }

.page-title h1,
.page-title p,
.panel-header h2,
.panel-header small,
.table-toolbar h2,
.toolbar-counter {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.page-actions > :is(button, a),
.panel-actions > :is(button, a) {
  max-width: 100%;
  white-space: normal;
  text-align: center;
}

.field,
.field input,
.field select,
.field textarea,
.toolbar-select { min-width: 0; max-width: 100%; }

.filter-select { min-width: 0; max-width: 100%; }
.filter-select summary { max-width: 100%; }
.filter-select summary > span,
.filter-select summary > span b { min-width: 0; max-width: 100%; }
.filter-select summary > span b {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.date-range-control,
.date-range-button,
.date-range-button > span { min-width: 0; max-width: 100%; }
.date-range-button > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table-toolbar .search {
  flex: 1 1 230px;
  width: auto;
  min-width: min(230px, 100%);
  max-width: 430px;
}
.toolbar-counter { white-space: normal; }

.kpi-card,
.kpi-head,
.kpi-head > *,
.kpi-value,
.kpi-foot { min-width: 0; max-width: 100%; }
.kpi-card { overflow: hidden; }
.kpi-head { gap: 10px; }
.kpi-head > span:first-child,
.kpi-value,
.kpi-foot {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.kpi-value {
  font-size: clamp(19px, 1.7vw, 25px);
  line-height: 1.18;
  white-space: normal;
}

.finance-metrics,
.finance-metric,
.finance-metric > div,
.finance-metric b,
.finance-metric strong { min-width: 0; }
.finance-metric > div { flex: 1 1 auto; }
.finance-metric b,
.finance-metric strong {
  max-width: 100%;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.finance-metric strong { flex: 0 1 auto; max-width: 40%; text-align: right; }
.finance-details { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) minmax(0, 1.15fr); }
.summary-line,
.summary-line > div,
.summary-line b,
.summary-line strong,
.expense-total > div,
.expense-legend div,
.expense-legend span,
.expense-legend b,
.expense-legend small { min-width: 0; max-width: 100%; }
.summary-line > div { flex: 1 1 auto; }
.summary-line b,
.summary-line strong,
.expense-total b,
.expense-legend span,
.expense-legend b,
.expense-legend small {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.summary-line strong { flex: 0 1 auto; max-width: 38%; text-align: right; }
.expense-legend div { grid-template-columns: 9px minmax(0, 1fr) minmax(0, auto) minmax(36px, 44px); }

.billing-summary { grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); }
.billing-summary > div,
.billing-summary h2,
.billing-summary b,
.admin-kpis > *,
.admin-settings-grid > *,
.admin-setting-card > * { min-width: 0; max-width: 100%; }
.billing-summary h2,
.billing-summary b,
.admin-kpis b,
.admin-setting-card h2,
.admin-setting-card p {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.admin-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-setting-card { grid-template-columns: auto minmax(0, 1fr) auto; }

.stocks-kpi-card b,
.stocks-kpi-card strong,
.stocks-kpi-card small,
.stocks-kpi-card em,
.stocks-kpi-card p,
.china-summary-grid b,
.china-summary-grid small,
.china-history-kpis b,
.china-order-page-kpis b,
.order-map-summary b {
  min-width: 0;
  max-width: 100%;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.subscription-banner > *,
.smtp-provider-banner > div,
.smtp-provider-banner span,
.balance-forecast-notice > div,
.order-map-pending > div,
.stocks-banner > * { min-width: 0; max-width: 100%; }
.subscription-banner,
.smtp-provider-banner,
.balance-forecast-notice,
.order-map-pending,
.stocks-banner {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.entity-card,
.integration-card,
.user-card,
.entity-card-head,
.integration-head,
.user-card-head,
.entity-card-head > *,
.integration-head > *,
.user-card-head > *,
.integration-body,
.integration-body > * { min-width: 0; max-width: 100%; }
.entity-card-head,
.integration-head,
.user-card-head,
.integration-body { flex-wrap: wrap; }
.entity-card-head h3,
.entity-card-head p,
.integration-head h3,
.integration-head p,
.user-card-head h3,
.user-card-head p,
.integration-body small {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.sync-settings {
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
}
.sync-settings .compact-toggle {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
}
.sync-settings select { flex: 1 1 132px; min-width: 0; max-width: 100%; }
.sync-settings > small {
  flex: 1 1 100%;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin-left: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.integration-fbs-status > div,
.integration-fbs-status b,
.integration-fbs-status small { min-width: 0; max-width: 100%; }
.integration-fbs-status b,
.integration-fbs-status small { white-space: normal; overflow-wrap: anywhere; word-break: break-word; }

.workspace-switch,
.user-menu,
.workspace-copy,
.user-copy,
.workspace-copy b,
.workspace-copy small,
.user-copy b,
.user-copy small { min-width: 0; max-width: 100%; }
.workspace-switch { max-width: min(330px, 36vw); }
.user-menu { max-width: min(285px, 30vw); }
.workspace-copy b,
.workspace-copy small,
.user-copy b,
.user-copy small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.modal-header,
.modal-actions { min-width: 0; gap: 10px; }
.modal-header h2 { min-width: 0; max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
.modal-actions { flex-wrap: wrap; }
.modal-actions > button { max-width: 100%; white-space: normal; text-align: center; }

.revenue-popover,
.expense-popover,
.formula-popover { width: min(360px, calc(100vw - 32px)); max-width: calc(100vw - 32px); }
.revenue-popover > b,
.revenue-popover > div,
.revenue-popover span,
.revenue-popover strong,
.revenue-popover small { min-width: 0; max-width: 100%; }
.revenue-popover span,
.revenue-popover strong,
.revenue-popover small { white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
.revenue-popover > div { grid-template-columns: minmax(0, 1fr) minmax(0, auto) minmax(38px, 46px) !important; }

@media (max-width: 1450px) {
  .finance-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .balance-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .status-legend { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .finance-metric:nth-child(odd) .revenue-popover { left: 0; right: auto; transform: none; }
  .finance-metric:nth-child(even) .revenue-popover { right: 0; left: auto; transform: none; }
  .china-timeline { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .china-history-toolbar,
  .china-settings-panel .panel-heading,
  .china-lines-panel .panel-heading,
  .china-history-panel .panel-heading { flex-wrap: wrap; }
  .china-settings-panel .panel-actions,
  .china-lines-panel .panel-actions { min-width: 0; max-width: 100%; }
}

@media (max-width: 1050px) {
  .admin-settings-grid { grid-template-columns: 1fr; }
  .system-card { grid-template-columns: auto minmax(0, 1fr); }
  .system-card > :is(.tag, .switch-button) { grid-column: 2; justify-self: start; }
  .system-hint { grid-column: 2; }
  .china-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .china-history-toolbar > div:first-child,
  .china-settings-panel .panel-actions,
  .china-lines-panel .panel-actions { width: 100%; }
  .china-tabs-row { flex-wrap: wrap; }
}

@media (max-width: 820px) {
  .status-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .smtp-provider-banner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 640px) {
  .finance-metrics,
  .balance-metrics,
  .status-legend { grid-template-columns: 1fr; }
  .table-toolbar .search { flex-basis: 100%; width: 100%; max-width: none; }
  .subscription-banner { align-items: flex-start; flex-wrap: wrap; }
  .subscription-banner button { width: 100%; margin-left: 0; }
  .modal-actions > button { flex: 1 1 170px; min-height: 42px; height: auto; padding-top: 9px; padding-bottom: 9px; }
  .china-timeline { grid-template-columns: 1fr; }
}

/* Mobile application shell. Desktop layout intentionally remains unchanged. */
.mobile-page-context,
.mobile-drawer-head,
.mobile-drawer-header,
.mobile-nav-backdrop,
.mobile-bottom-nav { display: none; }

@media (max-width: 820px) {
  :root {
    --mobile-shell-height: 116px;
    --mobile-nav-height: 72px;
    --mobile-page-gutter: 14px;
  }

  html, body { width: 100%; min-height: 100%; background: #f2f6ef; }
  body { overscroll-behavior-y: none; }
  body.mobile-nav-open { overflow: hidden; }

  .app {
    width: 100%;
    height: 100vh;
    height: 100dvh;
    min-height: 100vh;
    min-height: 100dvh;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
    background:
      radial-gradient(circle at 92% 2%, rgba(185, 239, 89, .13), transparent 28%),
      #f2f6ef;
  }
  .app::after { content: none; }

  .topbar {
    position: relative;
    z-index: 100;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px 44px;
    grid-template-rows: 58px 50px;
    gap: 0 7px;
    min-height: var(--mobile-shell-height);
    padding: max(4px, env(safe-area-inset-top)) var(--mobile-page-gutter) 8px;
    border-bottom: 1px solid rgba(211, 220, 205, .9);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 8px 26px rgba(37, 55, 30, .055);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
  .topbar .brand,
  .topbar-spacer,
  .topbar .sync-pill,
  .topbar > #logoutButton { display: none; }
  .mobile-nav-button,
  .topbar > #notificationsButton,
  .topbar > .user-menu {
    align-self: center;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    border: 1px solid #e6ebe2;
    border-radius: 14px;
    background: #f7f9f5;
  }
  .top-icon.mobile-nav-button { display: grid; grid-column: 1; grid-row: 1; }
  .topbar > #notificationsButton { display: grid; grid-column: 3; grid-row: 1; }
  .topbar > .user-menu {
    display: flex;
    grid-column: 4;
    grid-row: 1;
    justify-content: center;
    padding: 4px;
  }
  .topbar > .user-menu > svg,
  .topbar > .user-menu .user-copy { display: none; }
  .topbar > .user-menu .avatar { width: 34px; height: 34px; border-radius: 11px; }
  .mobile-page-context {
    display: flex;
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    align-self: center;
    flex-direction: column;
    gap: 2px;
    padding-left: 2px;
  }
  .mobile-page-context > :first-child {
    color: #70a91d;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .35px;
  }
  .mobile-page-context strong {
    min-width: 0;
    overflow: hidden;
    color: #20261e;
    font-size: 16px;
    font-weight: 850;
    letter-spacing: -.35px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .workspace-switch {
    grid-column: 1 / -1;
    grid-row: 2;
    align-self: stretch;
    width: 100%;
    max-width: none;
    min-width: 0;
    height: 46px;
    padding: 0 12px;
    border: 1px solid #dfe8d8;
    border-radius: 15px;
    background: linear-gradient(135deg, #f7faF4, #f0f7e9);
  }
  .workspace-switch .workspace-icon {
    display: grid;
    width: 31px;
    height: 31px;
    border-radius: 10px;
  }
  .workspace-switch small { font-size: 9px; }
  .workspace-switch b { font-size: 12px; }
  .workspace-switch > svg { margin-left: auto; }
  .workspace-dropdown,
  .user-dropdown {
    position: fixed;
    left: var(--mobile-page-gutter);
    right: var(--mobile-page-gutter);
    width: auto;
    min-width: 0;
    max-height: min(62vh, 520px);
    max-height: min(62dvh, 520px);
    overflow-y: auto;
    border-radius: 18px;
    box-shadow: 0 22px 60px rgba(26, 38, 22, .2);
  }
  .workspace-dropdown { top: calc(max(4px, env(safe-area-inset-top)) + 108px); }
  .user-dropdown { top: calc(max(4px, env(safe-area-inset-top)) + 58px); }

  .mobile-nav-backdrop {
    position: fixed;
    inset: 0;
    z-index: 180;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(18, 27, 15, .48);
    opacity: 0;
    pointer-events: none;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    transition: opacity .2s ease;
  }
  body.mobile-nav-open .mobile-nav-backdrop { display: block; opacity: 1; pointer-events: auto; }
  .sidebar {
    position: fixed;
    z-index: 190;
    top: 0;
    bottom: 0;
    left: 0;
    display: flex;
    width: min(88vw, 360px);
    height: 100vh;
    height: 100dvh;
    max-height: none;
    padding: 0 12px calc(18px + env(safe-area-inset-bottom));
    border: 0;
    border-radius: 0 28px 28px 0;
    background: #fff;
    box-shadow: 26px 0 70px rgba(19, 29, 16, .24);
    transform: translateX(-105%);
    transition: transform .24s cubic-bezier(.2, .78, .24, 1);
  }
  body.mobile-nav-open .sidebar { transform: translateX(0); }
  .mobile-drawer-head,
  .mobile-drawer-header {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    min-height: calc(70px + env(safe-area-inset-top));
    margin: 0 -12px 8px;
    padding: env(safe-area-inset-top) 14px 0;
    border-bottom: 1px solid #edf0ea;
    background: rgba(255, 255, 255, .96);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
  }
  .mobile-drawer-head .brand,
  .mobile-drawer-header .brand { display: flex; }
  .mobile-drawer-head .brand-symbol,
  .mobile-drawer-header .brand-symbol { width: 35px; height: 35px; border-radius: 11px; }
  .mobile-drawer-head .brand-word,
  .mobile-drawer-header .brand-word { font-size: 19px; }
  .mobile-drawer-close,
  #mobileNavClose {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid #e4e9e0;
    border-radius: 14px;
    background: #f4f7f1;
    cursor: pointer;
  }
  #sidebarNav { padding: 2px 0 12px; }
  .nav-item { min-height: 48px; padding: 12px; border-radius: 14px; font-size: 14px; }
  .nav-caption { min-height: 44px; padding: 11px 12px 9px; font-size: 13px; }
  .nav-subitem { min-height: 44px; padding: 10px 12px 10px 36px; border-radius: 12px; font-size: 13px; }
  .nav-item.active,
  .nav-subitem.active {
    background: linear-gradient(135deg, #edfad7, #e5f7c8);
    color: #4f8110;
    box-shadow: inset 0 0 0 1px rgba(126, 181, 45, .12);
  }
  .health-card { border: 1px solid #e3eadc; border-radius: 16px; }

  .mobile-bottom-nav {
    position: fixed;
    z-index: 75;
    right: 10px;
    bottom: calc(8px + env(safe-area-inset-bottom));
    left: 10px;
    display: grid;
    grid-template-columns: repeat(var(--mobile-nav-items, 5), minmax(0, 1fr));
    align-items: center;
    min-height: var(--mobile-nav-height);
    padding: 6px;
    border: 1px solid rgba(215, 224, 209, .92);
    border-radius: 22px;
    background: rgba(255, 255, 255, .93);
    box-shadow: 0 18px 48px rgba(31, 48, 24, .18);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
  }
  .mobile-bottom-nav a,
  .mobile-bottom-nav button {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 56px;
    padding: 5px 2px;
    border: 0;
    border-radius: 16px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: transparent;
    color: #7b8377;
    text-decoration: none;
    cursor: pointer;
  }
  .mobile-bottom-nav svg { width: 21px; height: 21px; stroke-width: 2.15; }
  .mobile-bottom-nav span {
    max-width: 100%;
    overflow: hidden;
    font-size: 9px;
    font-weight: 760;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-bottom-nav :is(a, button).active,
  .mobile-bottom-nav a[aria-current="page"] {
    background: var(--lime-soft);
    color: #4f8110;
  }
  .mobile-bottom-nav :is(a, button).active::before,
  .mobile-bottom-nav a[aria-current="page"]::before {
    content: "";
    position: absolute;
    top: 4px;
    width: 18px;
    height: 3px;
    border-radius: 4px;
    background: var(--lime-dark);
  }
  body.mobile-nav-open .mobile-bottom-nav { pointer-events: none; }

  .main {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    min-height: 0;
    max-height: none;
    padding: 20px var(--mobile-page-gutter) calc(var(--mobile-nav-height) + 30px + env(safe-area-inset-bottom));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-padding-bottom: calc(var(--mobile-nav-height) + 28px);
  }
  body.mobile-nav-open .main { overflow: hidden; }
  #pageContent { width: 100%; }

  .subscription-banner {
    top: -20px;
    margin: -20px calc(-1 * var(--mobile-page-gutter)) 16px;
    padding: 12px var(--mobile-page-gutter);
  }
  .page-header {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px;
  }
  .page-title h1 { margin-bottom: 5px; font-size: 25px; line-height: 1.12; letter-spacing: -.85px; }
  .page-title p { max-width: 46ch; font-size: 12px; line-height: 1.45; }
  .page-actions {
    width: calc(100% + var(--mobile-page-gutter));
    margin-right: calc(-1 * var(--mobile-page-gutter));
    padding: 1px var(--mobile-page-gutter) 3px 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }
  .page-actions::-webkit-scrollbar,
  .view-tabs::-webkit-scrollbar { display: none; }
  .page-actions > * { flex: 0 0 auto; scroll-snap-align: start; }
  .primary-button,
  .secondary-button,
  .ghost-button,
  .danger-button,
  .row-action { min-height: 44px; }

  .filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 10px;
    border-color: #dfe6da;
    border-radius: 18px;
    box-shadow: 0 8px 28px rgba(38, 55, 31, .045);
  }
  .filters-spacer { display: none; }
  .filters > :is(.date-range-control, .product-picker-tools, .unit-filter-tools, .balance-filter-notice, .search) { grid-column: 1 / -1; }
  .filter-select,
  .filter-select summary,
  .date-range-control,
  .date-range-button { width: 100%; min-width: 0; }
  .filter-select summary,
  .date-range-button { min-height: 46px; height: 46px; border-radius: 13px; }
  .filter-select summary { gap: 8px; }
  .reset-filter { grid-column: 1 / -1; min-height: 38px; justify-self: end; padding: 0 8px; }
  .filter-popover,
  .month-filter-popover,
  .date-range-popover,
  .unit-product-options {
    position: fixed;
    z-index: 145;
    top: auto;
    right: 12px;
    bottom: calc(var(--mobile-nav-height) + 18px + env(safe-area-inset-bottom));
    left: 12px;
    width: auto;
    min-width: 0;
    max-width: none;
    max-height: min(66vh, 560px);
    max-height: min(66dvh, 560px);
    overflow-y: auto;
    border-radius: 22px;
    box-shadow: 0 26px 80px rgba(22, 34, 18, .28);
  }
  .check-option { min-height: 46px; border-radius: 12px; }
  .check-option input { width: 19px; height: 19px; }

  .panel,
  .kpi-card,
  .finance-metric,
  .stocks-kpi-card,
  .china-history-kpis article,
  .china-order-page-kpis > div {
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(35, 52, 29, .045);
  }
  .panel { padding: 15px; }
  .panel-header,
  .panel-heading { gap: 10px; margin-bottom: 14px; }
  .panel-header h2,
  .panel-heading h2 { font-size: 16px; line-height: 1.25; }

  .kpi-grid,
  .finance-metrics,
  .balance-metrics,
  .unit-metrics,
  .stocks-summary-grid,
  .china-history-kpis,
  .china-order-page-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .kpi-card { min-height: 112px; padding: 14px; }
  .kpi-icon { width: 32px; height: 32px; border-radius: 11px; }
  .kpi-value { margin: 13px 0 6px; font-size: 20px; line-height: 1.15; letter-spacing: -.55px; }
  .kpi-head { font-size: 11px; }
  .kpi-foot { font-size: 10px; line-height: 1.35; }
  .finance-metric {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-content: start;
    align-items: center;
    min-height: 120px;
    padding: 13px;
    gap: 9px;
  }
  .finance-metric .round-icon { width: 38px; height: 38px; }
  .finance-metric > strong {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 100%;
    margin: 2px 0 0;
    text-align: left;
  }
  .unit-metrics > div { min-height: 116px; padding: 14px 11px 13px 52px; }
  .unit-metrics .round-icon { left: 10px; width: 34px; height: 34px; }
  .unit-metrics b { font-size: 16px; }
  .content-grid { grid-template-columns: 1fr; gap: 12px; }
  .dashboard-chart-panel .panel-header { flex-direction: column; }
  .dashboard-chart-controls,
  .balance-history-header-controls { width: 100%; justify-content: flex-start; margin-left: 0; }
  .view-tabs {
    max-width: 100%;
    padding-bottom: 2px;
    overflow-x: auto;
    flex-wrap: nowrap;
    scrollbar-width: none;
  }
  .view-tabs button { flex: 0 0 auto; min-height: 42px; }
  .dashboard-chart-box { min-height: 250px; }
  .dashboard-chart-box svg { min-height: 210px; }
  .chart-wrap { min-height: 250px; }
  .market-account-list,
  .market-account-empty { margin-left: 0; }

  .assistant-card,
  .assistant-card.compact {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
    border-radius: 20px;
  }
  .assistant-card .assistant-avatar,
  .assistant-card.compact .assistant-avatar { width: 56px; height: 56px; border-radius: 16px; }
  .assistant-copy h2,
  .assistant-card.compact .assistant-copy h2 { font-size: 15px; }
  .assistant-copy p { font-size: 11px; line-height: 1.5; }
  .assistant-card .assistant-action { grid-column: 1 / -1; width: 100%; }

  .table-panel { border-radius: 18px; }
  .table-toolbar {
    align-items: center;
    gap: 8px;
    padding: 13px 14px;
  }
  .table-toolbar h2 { flex: 1 1 150px; font-size: 15px; }
  .table-toolbar > :is(button, .row-action, select) { min-height: 42px; }
  .data-table-wrap {
    width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: #b7c4ad #eef2eb;
    -webkit-overflow-scrolling: touch;
  }
  .data-table { font-size: 12px; }
  .data-table th { padding: 12px; }
  .data-table td { padding: 13px 12px; }
  .data-table th.sortable-th button { min-height: 28px; }
  .dashboard-products-table :is(th, td):first-child,
  .unit-table .data-table :is(th, td):first-child,
  .cost-table :is(th, td):first-child,
  .stocks-group-table :is(th, td):first-child,
  .china-history-table :is(th, td):first-child {
    position: sticky;
    left: 0;
    z-index: 3;
    min-width: 210px;
    max-width: 240px;
    background: #fff;
    box-shadow: 7px 0 16px rgba(32, 46, 28, .075);
  }
  .dashboard-products-table thead th:first-child,
  .unit-table .data-table thead th:first-child,
  .cost-table thead th:first-child,
  .stocks-group-table thead th:first-child,
  .china-history-table thead th:first-child { z-index: 13; background: #f7f8f6; }
  .cost-table .product-cell { min-width: 0; max-width: 100%; }
  .data-table tr:hover td:first-child { background: #f3f4f2; }
  .floating-table-scroll { display: none !important; }
  .column-drawer { width: 100%; border-radius: 24px 24px 0 0; }
  .column-drawer-backdrop { display: flex; align-items: flex-end; }
  .column-drawer-head { padding: 17px 16px; }
  .column-drawer-actions { padding: 14px 16px calc(14px + env(safe-area-inset-bottom)); }

  .toast-root {
    right: 10px;
    bottom: calc(var(--mobile-nav-height) + 20px + env(safe-area-inset-bottom));
    left: 10px;
  }
  .toast { width: 100%; min-width: 0; border-radius: 15px; }
  .release-notes-drawer { width: 100%; border-radius: 24px 0 0 24px; }
  .release-notes-footer { padding-bottom: calc(13px + env(safe-area-inset-bottom)); }

  .modal-backdrop {
    align-items: end;
    padding: 12px 8px max(8px, env(safe-area-inset-bottom));
  }
  .modal,
  .modal:has(.china-delivery-edit) {
    width: 100%;
    max-width: none;
    max-height: 91vh;
    max-height: 91dvh;
    border-radius: 24px 24px 18px 18px;
  }
  .modal-header { position: sticky; top: 0; z-index: 3; padding: 17px 16px; background: #fff; }
  .modal-close { width: 42px; height: 42px; border-radius: 13px; }
  .modal-body { padding: 16px; }
  .modal-actions {
    position: sticky;
    bottom: 0;
    z-index: 3;
    padding: 13px 16px calc(13px + env(safe-area-inset-bottom));
    background: #fff;
  }
  .field input,
  .field select,
  .field textarea,
  .toolbar-select,
  .search { min-height: 48px; border-radius: 13px; font-size: 16px; }
  .yookassa-webhook-help { padding: 13px; }
  .yookassa-webhook-url { grid-template-columns: minmax(0, 1fr); }
  .yookassa-webhook-url .ghost-button { width: 100%; min-height: 42px; }
  .table-column-button,
  .row-menu,
  .expense-row-action,
  .revenue-info,
  .calendar-day,
  .catalog-search > button { min-width: 44px; min-height: 44px; }

  .dashboard-chart-day:focus,
  .unit-performance-chart .chart-day:focus,
  .balance-history-point-wrap:focus { outline: none; }
  .dashboard-chart-day:focus .dashboard-chart-focus { opacity: 1; }
  .dashboard-chart-day:focus .dashboard-chart-point { r: 6; opacity: 1; filter: drop-shadow(0 4px 8px rgba(120,189,34,.25)); }
  .dashboard-chart-day:focus .dashboard-chart-tooltip { display: block; }
  .unit-performance-chart .chart-day:focus .chart-focus-line { opacity: 1; }
  .unit-performance-chart .chart-day:focus .chart-day-tooltip { display: block; }
  .balance-history-point-wrap:focus .balance-history-point { r: 5.7; fill: var(--series-color); }
  .balance-history-point-wrap:focus .balance-history-tooltip { display: block; }
}

@media (max-width: 640px) {
  :root { --mobile-page-gutter: 12px; }

  .login-screen {
    min-height: 100vh;
    min-height: 100dvh;
    background:
      radial-gradient(circle at 84% 8%, rgba(185, 239, 89, .28), transparent 33%),
      linear-gradient(160deg, #f8fbf5 0%, #eef5e9 100%);
  }
  .login-panel {
    min-height: 100vh;
    min-height: 100dvh;
    padding: calc(24px + env(safe-area-inset-top)) 14px calc(24px + env(safe-area-inset-bottom));
  }
  .login-form {
    gap: 20px;
    padding: 24px 18px;
    border: 1px solid rgba(220, 229, 214, .9);
    border-radius: 28px;
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 26px 70px rgba(36, 57, 28, .12);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
  .login-form h2 { font-size: 30px; }
  .login-mobile-brand { margin-bottom: 2px; }

  .form-grid { grid-template-columns: 1fr; }
  .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .billing-summary,
  .admin-kpis,
  .china-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-details,
  .unit-chart-details,
  .payout-month-grid,
  .entity-grid,
  .integration-grid,
  .user-grid { grid-template-columns: 1fr; }
  .table-toolbar .search { flex-basis: 100%; width: 100%; max-width: none; }
  .order-map-canvas { height: 58vh; height: 58dvh; min-height: 350px; border-radius: 16px; }
}

@media (max-width: 360px) {
  .topbar { grid-template-columns: 42px minmax(0, 1fr) 42px 42px; gap: 0 4px; }
  .mobile-nav-button,
  .topbar > #notificationsButton,
  .topbar > .user-menu { width: 42px; height: 42px; min-width: 42px; min-height: 42px; }
  .mobile-page-context strong { font-size: 14px; }
  .mobile-bottom-nav { right: 6px; left: 6px; padding: 5px 3px; }
  .mobile-bottom-nav span { font-size: 8px; }
  .kpi-card { padding: 12px; }
  .kpi-value { font-size: 18px; }
  .finance-metric { padding: 11px; }
  .dashboard-products-table :is(th, td):first-child,
  .unit-table .data-table :is(th, td):first-child,
  .cost-table :is(th, td):first-child,
  .stocks-group-table :is(th, td):first-child,
  .china-history-table :is(th, td):first-child {
    width: 165px !important;
    min-width: 155px !important;
    max-width: 165px !important;
  }
}

@media (max-width: 820px) {
  .filters > .stock-fbo-time-filter { grid-column: 1 / -1; }
  .stock-fbo-time-filter {
    width: 100%;
    align-items: stretch;
    flex-wrap: wrap;
  }
  .stock-fbo-time-tabs { flex: 1 1 280px; }
  .stock-fbo-time-tabs .stocks-tab { flex: 1 1 0; min-width: 0; }
  .stock-fbo-history-date { flex: 1 1 230px; }
  .stock-fbo-history-date input { width: 100%; }
  .stock-fbo-history-status { align-items: flex-start; flex-direction: column; }
  .stock-fbo-history-heading,
  .stock-fbo-snapshot-list { width: 100%; }
  .stock-fbo-snapshot-chip { flex: 1 1 190px; max-width: none; }
}

@media (max-width: 480px) {
  .stock-fbo-time-filter { gap: 7px; }
  .stock-fbo-time-tabs { width: 100%; flex-basis: 100%; }
  .stock-fbo-time-tabs .stocks-tab { min-height: 39px; padding: 0 8px; font-size: 10px; }
  .stock-fbo-history-date { width: 100%; flex-basis: 100%; }
  .stock-fbo-history-status { padding: 11px; border-radius: 13px; }
  .stock-fbo-snapshot-chip { flex-basis: 100%; width: 100%; }
  .stock-fbo-available-dates button { min-height: 34px; }
}

@media (max-width: 820px) and (prefers-reduced-motion: reduce) {
  .sidebar,
  .mobile-nav-backdrop,
  .mobile-bottom-nav { transition: none; }
  .data-table-wrap { scroll-behavior: auto; }
}

/* Feedback inbox */
.operational-notifications { display: grid; gap: 9px; margin-bottom: 16px; }
.notification-section-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 3px; }
.notification-section-title h3 { margin: 0; color: #5f665c; font-size: 10px; font-weight: 850; letter-spacing: .7px; text-transform: uppercase; }
.notification-section-title > span { display: grid; place-items: center; min-width: 24px; height: 24px; padding: 0 7px; border-radius: 999px; background: #edf2e8; color: #60705a; font-size: 9px; font-weight: 850; }
.notification-section-title.release-news-title { margin: 3px 0 9px; }
.operational-notification { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 10px; padding: 13px; border: 1px solid #e6d8ad; border-radius: 14px; background: #fffaf0; }
.operational-notification.error { border-color: #efc7c5; background: #fff5f4; }
.operational-notification.read { opacity: .84; }
.operational-notification-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: #ffedbd; color: #9a6b0c; }
.operational-notification.error .operational-notification-icon { background: #ffe0de; color: #b94641; }
.operational-notification b { display: block; font-size: 11px; overflow-wrap: anywhere; }
.operational-notification p { margin: 4px 0 0; color: #686f64; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.operational-notification small { display: flex; align-items: center; gap: 6px; margin-top: 7px; color: var(--muted); font-size: 9px; }
.operational-notification small .market-icon { width: 19px; height: 19px; font-size: 7px; }
.operational-notification > .row-action { margin-top: 1px; }
.integration-expiry { min-width: 0; display: flex; align-items: center; gap: 8px; margin: 0 15px 10px; padding: 9px 10px; border: 1px solid #dbe8d1; border-radius: 10px; background: #f8fcf5; color: #54724b; font-size: 10px; font-weight: 750; }
.integration-expiry svg { flex: 0 0 auto; }
.integration-expiry span { overflow-wrap: anywhere; }
.integration-expiry.warning { border-color: #ead8a9; background: #fff9ea; color: #856315; }
.integration-expiry.error { border-color: #efc6c3; background: #fff3f2; color: #aa403c; }
.credential-expiry-hint { display: flex; align-items: center; gap: 5px; margin: -7px 0 2px; padding-left: 2px; font-size: 9px; font-weight: 750; }
.credential-expiry-hint.success { color: #5f8b25; }
.credential-expiry-hint.warning { color: #a47416; }
.credential-expiry-field { padding: 10px; border: 1px solid #e1e7dc; border-radius: 11px; background: #fafbf9; }
.credential-expiry-field > small { margin-top: 5px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.modal:has(.feedback-modal-content) { width: min(860px, calc(100% - 28px)); max-height: min(900px, calc(100vh - 28px)); }
.modal:has(.admin-feedback-detail) { width: min(1120px, calc(100% - 28px)); max-height: min(920px, calc(100vh - 28px)); }
.modal:has(.admin-feedback-detail) .modal-body { min-height: 0; overflow-y: auto; }
.modal:has(.feedback-modal-content) .modal-body { min-height: 0; overflow-y: auto; }
.feedback-modal-content,
.admin-feedback-detail { min-width: 0; display: grid; gap: 14px; }
.feedback-intro { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; padding: 14px; border: 1px solid #dbe8ce; border-radius: 14px; background: linear-gradient(135deg, #f8fdec, #fff); }
.feedback-intro > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--lime); color: #344820; }
.feedback-intro b { display: block; margin: 1px 0 4px; font-size: 14px; }
.feedback-intro p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.feedback-form-grid { display: grid; grid-template-columns: minmax(170px, .65fr) minmax(260px, 1.35fr); gap: 12px; }
.feedback-modal-content textarea,
.admin-feedback-detail textarea { resize: vertical; min-height: 112px; line-height: 1.5; }
.feedback-upload { position: relative; min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 12px; border: 1px dashed #cfdac8; border-radius: 13px; background: #fafcf8; cursor: pointer; }
.feedback-upload:hover { border-color: #9fc75d; background: #f8fceF; }
.feedback-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.feedback-upload-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: var(--lime-soft); color: #608b22; }
.feedback-upload b,
.feedback-upload small { display: block; min-width: 0; overflow-wrap: anywhere; }
.feedback-upload b { font-size: 12px; }
.feedback-upload small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.feedback-file-button { height: 34px; padding: 0 12px; font-size: 10px; pointer-events: none; }
.feedback-preview { min-width: 0; display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 9px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.feedback-preview.hidden { display: none; }
.feedback-preview img { width: 72px; height: 54px; object-fit: cover; border-radius: 8px; background: #f0f2ef; }
.feedback-preview b,
.feedback-preview small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.feedback-preview b { font-size: 11px; }
.feedback-preview small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.feedback-security-note { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border-radius: 11px; background: #fff8e8; color: #7a5a17; font-size: 10px; line-height: 1.45; }
.feedback-security-note svg { flex: 0 0 auto; }
.feedback-history { display: grid; gap: 9px; padding-top: 4px; border-top: 1px solid var(--line); }
.feedback-section-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.feedback-section-title h3 { margin: 0; font-size: 13px; }
.feedback-section-title span { display: grid; place-items: center; min-width: 25px; height: 25px; padding: 0 7px; border-radius: 999px; background: #eff3eb; color: var(--muted); font-size: 10px; font-weight: 800; }
.feedback-history-empty { padding: 20px; border: 1px dashed #d9dfd5; border-radius: 12px; color: var(--muted); font-size: 11px; text-align: center; }
.feedback-history-item { min-width: 0; display: grid; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: #fff; }
.feedback-history-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.feedback-history-head > div { min-width: 0; }
.feedback-history-head b,
.feedback-history-head small { display: block; overflow-wrap: anywhere; }
.feedback-history-head b { font-size: 11px; }
.feedback-history-head small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.feedback-history-item > p,
.feedback-creator-reply p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 11px; line-height: 1.55; }
.feedback-attachment-link { display: inline-flex; justify-self: start; align-items: center; gap: 6px; color: #5d8e1d; font-size: 10px; font-weight: 750; text-decoration: none; }
.feedback-creator-reply { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 9px; padding: 10px; border-radius: 10px; background: var(--lime-soft); }
.feedback-creator-reply > span { color: #62921f; }
.feedback-creator-reply b { display: block; margin-bottom: 4px; font-size: 10px; }
.feedback-creator-reply small { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
.feedback-reply-images { min-width: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.feedback-reply-images a { display: block; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: #f3f5f1; }
.feedback-reply-images img { display: block; width: 100%; height: 150px; object-fit: contain; background: #f3f5f1; }
.feedback-reply-images.compact { margin-top: 9px; grid-template-columns: repeat(auto-fill, minmax(110px, 150px)); }
.feedback-reply-images.compact img { height: 100px; }
.admin-feedback-response-grid { display: grid; grid-template-columns: minmax(180px, .32fr) minmax(0, 1.68fr); gap: 12px; align-items: start; }
.admin-feedback-response-grid textarea { min-height: 210px; }
.admin-feedback-upload { margin-top: 2px; }
.feedback-reply-preview-list { min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px; }
.feedback-reply-preview-list.hidden { display: none; }
.feedback-reply-preview-list > div { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 8px; align-items: center; padding: 9px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fafcf8; }
.feedback-reply-preview-list span { grid-row: 1 / span 2; color: #66952a; }
.feedback-reply-preview-list b,
.feedback-reply-preview-list small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.feedback-reply-preview-list b { font-size: 10px; }
.feedback-reply-preview-list small { color: var(--muted); font-size: 9px; }
.admin-feedback-toolbar { display: grid; grid-template-columns: minmax(190px, 1fr) auto auto minmax(220px, .8fr); align-items: center; }
.admin-feedback-toolbar h2 { margin: 0; }
.admin-feedback-toolbar > div small { color: var(--muted); font-size: 10px; }
.table-subline { display: block; max-width: 360px; margin-top: 4px; color: var(--muted); font-size: 9px; white-space: normal; overflow-wrap: anywhere; }
.feedback-description-preview { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.admin-feedback-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.admin-feedback-meta > div { min-width: 0; display: grid; gap: 3px; padding: 10px; border: 1px solid var(--line); border-radius: 11px; background: #fafbf9; }
.admin-feedback-meta small,
.admin-feedback-meta span { color: var(--muted); font-size: 9px; overflow-wrap: anywhere; }
.admin-feedback-meta b { font-size: 11px; overflow-wrap: anywhere; }
.admin-feedback-message { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 13px; background: #fff; }
.admin-feedback-message h3 { margin: 10px 0 6px; font-size: 15px; overflow-wrap: anywhere; }
.admin-feedback-message p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.55; font-size: 11px; }
.feedback-screenshot-card { position: relative; display: block; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: #f3f5f1; color: inherit; text-decoration: none; }
.feedback-screenshot-card img { display: block; width: 100%; max-height: 310px; object-fit: contain; }
.feedback-screenshot-card span { position: absolute; right: 9px; bottom: 9px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border-radius: 9px; background: rgba(25, 31, 22, .78); color: #fff; font-size: 9px; font-weight: 750; }
.feedback-technical { min-width: 0; padding: 10px 12px; border-radius: 11px; background: #f5f7f3; }
.feedback-technical summary { cursor: pointer; font-size: 10px; font-weight: 750; }
.feedback-technical p { margin: 7px 0 0; color: var(--muted); font-size: 9px; overflow-wrap: anywhere; }

@media (max-width: 900px) {
  .admin-feedback-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-feedback-toolbar > div,
  .admin-feedback-toolbar .search { grid-column: 1 / -1; max-width: none; width: 100%; }
}

@media (max-width: 640px) {
  .feedback-form-grid,
  .admin-feedback-meta,
  .admin-feedback-response-grid { grid-template-columns: 1fr; }
  .feedback-upload { grid-template-columns: auto minmax(0, 1fr); }
  .feedback-file-button { grid-column: 1 / -1; width: 100%; }
  .feedback-preview { grid-template-columns: 58px minmax(0, 1fr) auto; }
  .feedback-preview img { width: 58px; height: 46px; }
  .feedback-reply-images,
  .feedback-reply-images.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .feedback-reply-images img,
  .feedback-reply-images.compact img { height: 110px; }
  .admin-feedback-toolbar { grid-template-columns: 1fr; }
  .admin-feedback-toolbar > * { grid-column: 1; width: 100%; }
}

/* Billing: saved card and automatic renewal */
.billing-autopay-card { display: grid; min-width: 0; gap: 15px; margin-bottom: 16px; overflow: hidden; }
.billing-autopay-heading { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 14px; }
.billing-autopay-title { display: flex; min-width: 0; align-items: center; gap: 12px; }
.billing-autopay-title > div { min-width: 0; }
.billing-autopay-title h2 { margin: 0 0 4px; font-size: 16px; overflow-wrap: anywhere; }
.billing-autopay-title p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.billing-autopay-heading > .tag { flex: 0 0 auto; }
.billing-autopay-state { display: grid; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.billing-autopay-state > div { min-width: 0; padding: 13px; border: 1px solid #e0e8d9; border-radius: 12px; background: #fafcf8; }
.billing-autopay-state small { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; }
.billing-autopay-state b { display: flex; min-width: 0; align-items: center; gap: 7px; font-size: 13px; overflow-wrap: anywhere; }
.billing-autopay-state b svg { flex: 0 0 auto; color: #6d9f2d; }
.billing-autopay-state p { margin: 7px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.billing-autopay-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.billing-autopay-actions button { min-height: 38px; }
.billing-autopay-actions .billing-detach-button { margin-left: auto; }
.billing-autopay-footnote { margin: -3px 0 0; color: var(--muted); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.billing-checkout-dialog { display: grid; min-width: 0; gap: 13px; }
.billing-checkout-summary { display: grid; min-width: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.billing-checkout-summary > span { display: grid; min-width: 0; gap: 4px; padding: 11px; border: 1px solid #e1e8dc; border-radius: 11px; background: #fafcf8; }
.billing-checkout-summary small { color: var(--muted); font-size: 10px; }
.billing-checkout-summary b { font-size: 13px; overflow-wrap: anywhere; }
.billing-autopay-consent,
.billing-detach-confirm { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 11px; padding: 13px; border: 1px solid #bcd991; border-radius: 13px; background: linear-gradient(135deg, #fbfff6, #f3f9e9); cursor: pointer; }
.billing-autopay-consent input,
.billing-detach-confirm input { width: 19px; height: 19px; margin: 1px 0 0; accent-color: #76ad2e; }
.billing-autopay-consent span { display: grid; min-width: 0; gap: 5px; }
.billing-autopay-consent b { font-size: 13px; overflow-wrap: anywhere; }
.billing-autopay-consent small { color: #5d6856; font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.billing-yookassa-memory-note { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 9px; padding: 11px 12px; border-radius: 11px; background: #fff7dc; color: #715714; font-size: 11px; line-height: 1.45; }
.billing-yookassa-memory-note.is-neutral { background: #f1f5ee; color: #596454; }
.billing-yookassa-memory-note svg { flex: 0 0 auto; }
.billing-yookassa-memory-note span { min-width: 0; overflow-wrap: anywhere; }
.billing-consent-note { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.billing-autopay-confirm { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 11px; padding: 14px; border: 1px solid #cfe1b4; border-radius: 13px; background: #f8fdec; }
.billing-autopay-confirm.is-warning { border-color: #ead9aa; background: #fff9ea; }
.billing-autopay-confirm b { display: block; margin: 1px 0 5px; font-size: 13px; }
.billing-autopay-confirm p { margin: 5px 0 0; color: #5f6959; font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.billing-detach-warning { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 10px; padding: 13px; border: 1px solid #efc5c2; border-radius: 12px; background: #fff4f3; color: #943d39; }
.billing-detach-warning b { display: block; margin-bottom: 4px; font-size: 12px; }
.billing-detach-warning p { margin: 0; font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.billing-detach-confirm { border-color: #ead4d2; background: #fffafa; color: #5c3f3d; font-size: 11px; line-height: 1.5; }
.yookassa-autopay-help { display: grid; gap: 10px; padding: 14px; border: 1px solid #d8d3eb; border-radius: 13px; background: linear-gradient(135deg, #fbfaff, #f5f3fc); }
.yookassa-autopay-heading { display: flex; min-width: 0; align-items: flex-start; gap: 11px; }
.yookassa-autopay-heading > div { min-width: 0; }
.yookassa-autopay-heading .round-icon { flex: 0 0 auto; background: #e9e4f8; color: #6b58a0; }
.yookassa-autopay-heading b { display: block; color: #46386e; font-size: 13px; }
.yookassa-autopay-heading p { margin: 4px 0 0; color: #665e7c; font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.yookassa-autopay-help ul { display: grid; gap: 7px; margin: 0; padding-left: 21px; color: #585168; font-size: 11px; line-height: 1.5; }
.yookassa-autopay-help code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-weight: 750; }
.yookassa-autopay-disclaimer { margin: 0; padding-top: 9px; border-top: 1px solid rgba(101, 85, 146, .16); color: #726a82; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.modal:has(.billing-checkout-dialog) { width: min(620px, 100%); }

@media (max-width: 640px) {
  .billing-autopay-heading { align-items: stretch; flex-direction: column; }
  .billing-autopay-heading > .tag { align-self: flex-start; }
  .billing-autopay-state,
  .billing-checkout-summary { grid-template-columns: 1fr; }
  .billing-autopay-actions { display: grid; grid-template-columns: 1fr; }
  .billing-autopay-actions button,
  .billing-autopay-actions .billing-detach-button { width: 100%; margin-left: 0; }
  .billing-autopay-consent,
  .billing-detach-confirm { padding: 12px; }
  .yookassa-autopay-help { padding: 12px; }
}
/* Product returns */
.return-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

.return-summary-card {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
  padding: 18px;
  border: 1px solid #dfe8d9;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(39, 63, 28, .055);
}

.return-summary-card > span {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  color: #34472b;
  background: #eef6ea;
}

.return-summary-card > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.return-summary-card small,
.return-summary-card em {
  color: #76806f;
  font-size: 12px;
  font-style: normal;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.return-summary-card b {
  color: #1e2b1a;
  font-size: clamp(22px, 2vw, 29px);
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.return-summary-card.warning > span { color: #8e5d00; background: #fff4d7; }
.return-summary-card.danger > span { color: #b53737; background: #fff0ee; }
.return-summary-card.money > span { color: #41611e; background: #eff8de; }

.return-period-panel,
.return-table-panel {
  margin-bottom: 16px;
}

.return-period-head,
.return-toolbar,
.return-table-title {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.return-period-head {
  justify-content: space-between;
  margin-bottom: 16px;
}

.return-period-head h2,
.return-table-title h2 { margin: 0; }
.return-period-head p { margin: 4px 0 0; color: #778171; font-size: 13px; }

.return-month-select {
  display: grid;
  gap: 5px;
  flex: 0 0 auto;
  color: #687262;
  font-size: 12px;
}

.return-month-select select,
.return-toolbar select,
.return-table-title select {
  min-height: 40px;
  border: 1px solid #dce5d8;
  border-radius: 11px;
  background: #fff;
  color: #263322;
  padding: 0 34px 0 12px;
}

.return-period-values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.return-period-values article {
  display: grid;
  gap: 4px;
  padding: 15px 17px;
  border: 1px solid #e1e9dd;
  border-radius: 14px;
  background: #fbfdf9;
}

.return-period-values span { color: #626d5c; font-size: 13px; }
.return-period-values b { color: #25321f; font-size: 24px; }
.return-period-values small { color: #818a7c; font-size: 12px; }
.return-period-values .return-period-total { border-color: #cce3b6; background: #f5fbe9; }

.return-api-notes {
  display: grid;
  gap: 7px;
  margin-top: 13px;
  padding-top: 13px;
  border-top: 1px solid #edf1ea;
}

.return-api-notes p {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin: 0;
  color: #6c7667;
  font-size: 12px;
  line-height: 1.45;
}

.return-api-notes svg { flex: 0 0 auto; color: #779959; margin-top: 1px; }

.return-toolbar {
  flex-wrap: wrap;
  padding-bottom: 14px;
}

.return-search {
  display: flex;
  align-items: center;
  flex: 1 1 300px;
  min-width: 220px;
  height: 42px;
  border: 1px solid #dce5d8;
  border-radius: 12px;
  background: #fff;
  padding: 0 10px;
  color: #7b8675;
}

.return-search input {
  min-width: 0;
  width: 100%;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  padding: 0 9px;
  color: #263322;
}

.return-search button {
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: #778171;
  cursor: pointer;
}

.return-sync-time {
  margin-left: auto;
  color: #7a8474;
  font-size: 12px;
  white-space: nowrap;
}

.return-sync-errors {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 13px;
  padding: 11px 13px;
  border: 1px solid #f0c8c2;
  border-radius: 11px;
  background: #fff5f3;
  color: #93453b;
  font-size: 12px;
  line-height: 1.45;
}

.return-table-title { flex-wrap: wrap; }
.return-table-title .catalog-page-size { margin-left: auto; }

.product-returns-table-wrap {
  max-height: min(68vh, 760px);
  overflow: auto;
  scrollbar-gutter: stable;
}

.product-returns-table {
  min-width: 1540px;
  table-layout: fixed;
}

.product-returns-table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  min-width: 94px;
  border-right-color: #dbe4d7;
  background: #f7faf5;
}

.product-returns-table thead th:nth-child(1) { width: 88px; }
.product-returns-table thead th:nth-child(2) { width: 160px; }
.product-returns-table thead th:nth-child(3) { width: 285px; }
.product-returns-table thead th:nth-child(4) { width: 175px; }
.product-returns-table thead th:nth-child(5) { width: 250px; }
.product-returns-table thead th:nth-child(6) { width: 165px; }
.product-returns-table thead th:nth-child(7) { width: 155px; }
.product-returns-table thead th:nth-child(8) { width: 205px; }
.product-returns-table thead th:nth-child(9) { width: 105px; }
.product-returns-table thead th:nth-child(10) { width: 150px; }
.product-returns-table thead th:nth-child(11) { width: 155px; }

.product-returns-table td {
  vertical-align: top;
  border-right-color: #edf1ea;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}

.product-returns-table tr.return-row-active:hover td { background: #f8fced; }

.product-returns-sort {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.product-returns-sort span { overflow-wrap: anywhere; }
.product-returns-sort svg { opacity: .32; flex: 0 0 auto; }
.product-returns-sort.active { color: #55752e; }
.product-returns-sort.active svg { opacity: 1; }

.return-market {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
}

.return-market .market-icon { margin: 0; }

.return-account,
.return-reference,
.return-location {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.return-account b,
.return-reference b,
.return-location b { overflow-wrap: anywhere; }
.return-account small,
.return-reference small,
.return-location small,
.return-raw-status { color: #7b8575; font-size: 11px; overflow-wrap: anywhere; }

.return-product-cell { align-items: flex-start; }
.return-product-cell > div:last-child { min-width: 0; }
.return-product-cell b { display: block; white-space: normal; overflow-wrap: anywhere; }

.return-article {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  margin-top: 5px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #6b7665;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.return-status,
.return-deadline,
.return-cost-unavailable {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
  max-width: 100%;
  border-radius: 999px;
  padding: 5px 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
}

.return-status.active { color: #4b6b24; background: #edf8dc; }
.return-status.completed { color: #667060; background: #eef1ec; }
.return-status.neutral { color: #665d45; background: #f5f1e7; }
.return-raw-status { display: block; margin-top: 5px; }

.return-deadline.overdue { color: #a92d2d; background: #fff0ee; }
.return-deadline.urgent { color: #915700; background: #fff4d5; }
.return-deadline.safe { color: #4c6d29; background: #eff8e4; }
.return-deadline.completed,
.return-deadline.unknown { color: #687166; background: #f0f2ef; }
.return-storage-cost { color: #3f641b; }
.return-cost-unavailable { color: #6f766b; background: #f0f2ef; font-weight: 600; }

@media (max-width: 1180px) {
  .return-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .return-period-values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .return-period-values .return-period-total { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  .return-summary-grid,
  .return-period-values { grid-template-columns: 1fr; }
  .return-period-values .return-period-total { grid-column: auto; }
  .return-period-head { align-items: stretch; flex-direction: column; }
  .return-month-select select { width: 100%; }
  .return-toolbar { align-items: stretch; flex-direction: column; }
  .return-toolbar select,
  .return-search { width: 100%; }
  .return-sync-time { margin-left: 0; }
  .return-table-title .catalog-page-size { margin-left: 0; }
  .return-summary-card { padding: 15px; }
}
