:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #15203a;
  background: #f3f6fb;
  font-synthesis: none;
  --blue: #005bff;
  --blue-dark: #0044c8;
  --ink: #15203a;
  --muted: #69748d;
  --line: #dde3ee;
  --panel: #fff;
  --green: #09824b;
  --red: #c9324c;
  --amber: #9a6500;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 320px; }
button, input, select, textarea { font: inherit; }
button { touch-action: manipulation; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 10px; font-size: clamp(28px, 4vw, 44px); line-height: 1.08; letter-spacing: -.035em; }
h2 { margin-bottom: 0; font-size: 22px; letter-spacing: -.018em; }
a { color: inherit; }

.topbar {
  position: sticky;
  z-index: 10;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 70px;
  border-bottom: 1px solid rgba(221, 227, 238, .9);
  background: rgba(255, 255, 255, .93);
  backdrop-filter: blur(12px);
  padding: 10px max(18px, calc((100vw - 1260px) / 2));
}

.brand { display: flex; align-items: center; gap: 11px; text-decoration: none; }
.brand > span:last-child { display: grid; line-height: 1.2; }
.brand small { margin-top: 2px; color: var(--muted); font-size: 11px; }
.brand-mark {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border-radius: 18px;
  background: var(--blue);
  color: white;
  font-size: 28px;
  font-weight: 850;
  box-shadow: 0 12px 26px rgba(0, 91, 255, .24);
}
.brand-mark.small { width: 42px; height: 42px; border-radius: 13px; font-size: 21px; box-shadow: none; }
.topbar-actions, .heading-actions, .form-actions { display: flex; align-items: center; gap: 10px; }
.topbar form { margin: 0; }
.user-chip { max-width: 180px; overflow: hidden; border-radius: 999px; background: #edf3ff; color: #315b9f; font-size: 12px; font-weight: 750; padding: 8px 11px; text-overflow: ellipsis; white-space: nowrap; }

.dashboard-shell { width: min(1260px, calc(100% - 36px)); margin: 34px auto 80px; }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; margin-bottom: 24px; }
.page-heading .muted { max-width: 720px; margin-bottom: 0; }
.eyebrow { margin-bottom: 7px; color: var(--blue); font-size: 11px; font-weight: 850; letter-spacing: .13em; }
.muted { color: var(--muted); line-height: 1.5; }
.compact { margin: 4px 0 0; font-size: 13px; }

.button {
  min-height: 42px;
  border: 1px solid transparent;
  border-radius: 11px;
  cursor: pointer;
  font-weight: 750;
  padding: 9px 15px;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.button:hover { transform: translateY(-1px); }
.button:disabled { cursor: wait; opacity: .55; transform: none; }
.button.primary { background: var(--ink); color: #fff; }
.button.accent { background: var(--blue); color: #fff; }
.button.accent:hover { background: var(--blue-dark); }
.button.secondary { border-color: #cbd3e1; background: #fff; color: var(--ink); }
.button.ghost { background: transparent; color: var(--muted); }
.button.danger { border-color: #f0c4cc; background: #fff3f5; color: var(--red); }
.button.small-button { min-height: 34px; border-radius: 9px; padding: 6px 10px; font-size: 12px; }
.wide { width: 100%; }
.nav-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.nav-link.active { border-color: #abc4f6; background: #edf3ff; color: var(--blue); }

.status-pill, .tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 29px;
  border-radius: 999px;
  background: #edf1f7;
  color: #59657c;
  font-size: 12px;
  font-weight: 750;
  padding: 5px 10px;
  white-space: nowrap;
}
.status-pill::before { width: 7px; height: 7px; border-radius: 50%; background: currentColor; content: ""; }
.status-pill.online, .tag.ok { background: #e7f8ef; color: var(--green); }
.status-pill.offline, .tag.error { background: #fff0f3; color: var(--red); }
.tag.pending { background: #fff5d8; color: var(--amber); }
.tag.own { background: #e8f0ff; color: var(--blue); }

.flash { margin-bottom: 18px; border: 1px solid #bcd0fa; border-radius: 12px; background: #edf3ff; color: #174fbd; padding: 12px 15px; }
.flash.error { border-color: #f1bdc6; background: #fff0f3; color: var(--red); }
.flash.success { border-color: #bae6ce; background: #ecf9f2; color: var(--green); }

.summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.summary-card, .panel {
  border: 1px solid var(--line);
  background: var(--panel);
  box-shadow: 0 10px 34px rgba(28, 42, 72, .045);
}
.summary-card { display: grid; min-height: 130px; align-content: center; border-radius: 17px; padding: 20px; }
.summary-card span { color: var(--muted); font-size: 13px; font-weight: 700; }
.summary-card strong { margin: 4px 0 0; font-size: 34px; letter-spacing: -.04em; }
.summary-card small { color: #8b94a7; }
.summary-card.danger-card strong { color: var(--red); }
.summary-card.warning-card strong { color: var(--amber); }

.panel { margin-bottom: 18px; border-radius: 19px; padding: 24px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-bottom: 20px; }
.panel-heading .eyebrow { margin-bottom: 5px; }
.store-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.store-card { border: 1px solid var(--line); border-radius: 15px; background: #fafbfe; padding: 16px; }
.store-card.error-card { border-color: #f1c7ce; background: #fffafb; }
.store-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.store-card h3 { overflow: hidden; margin: 0 0 5px; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.store-card a { color: var(--blue); font-size: 12px; text-decoration: none; }
.store-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 17px 0; }
.store-meta div { border-radius: 10px; background: #fff; padding: 9px; }
.store-meta span { display: block; color: var(--muted); font-size: 10px; }
.store-meta strong { display: block; margin-top: 3px; font-size: 13px; }
.store-error { margin: 10px 0; color: var(--red); font-size: 12px; }
.card-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.loading-block, .empty-state { color: #8a93a5; padding: 18px 0; }

.filters { display: flex; gap: 9px; }
input, select, textarea {
  min-height: 43px;
  border: 1px solid #ccd4e2;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  outline: none;
  padding: 9px 11px;
}
input:focus, select:focus, textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0, 91, 255, .12); }
label > span { display: block; margin-bottom: 6px; color: #515d75; font-size: 12px; font-weight: 700; }

.table-wrap { overflow: auto; }
table { width: 100%; border-collapse: collapse; min-width: 900px; }
th { border-bottom: 1px solid var(--line); color: #7b8598; font-size: 11px; letter-spacing: .035em; text-align: left; text-transform: uppercase; padding: 10px 12px; }
td { border-bottom: 1px solid #edf0f5; padding: 13px 12px; vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
.product-cell { display: grid; max-width: 360px; gap: 4px; }
.product-cell a { overflow: hidden; color: var(--ink); font-size: 13px; font-weight: 750; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.product-cell small, td small { color: var(--muted); }
.price-value { white-space: nowrap; font-weight: 730; }
.row-actions { display: flex; justify-content: flex-end; gap: 6px; }
.empty-cell { color: #8a93a5; text-align: center; padding: 34px; }
.disabled-row { opacity: .5; }

.two-column { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; }
.two-column .panel { margin-bottom: 0; }
.event-list { display: grid; gap: 9px; }
.event-item { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; border-radius: 11px; background: #f7f9fc; padding: 11px; }
.event-icon { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 10px; background: #eaf1ff; }
.event-item strong { display: block; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.event-item small { color: var(--muted); font-size: 11px; }
.event-values { font-size: 12px; font-weight: 700; white-space: nowrap; }
.settings-form { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.settings-form label input { width: 100%; }
.check-line { display: flex; align-items: center; grid-column: 1 / -1; gap: 8px; cursor: pointer; }
.check-line input { width: 17px; min-height: 17px; }
.check-line span { margin: 0; }
.settings-form .form-actions, .settings-form .compact { grid-column: 1 / -1; }

.modal { width: min(620px, calc(100% - 24px)); max-height: calc(100vh - 24px); border: 0; border-radius: 20px; box-shadow: 0 30px 80px rgba(18, 31, 58, .22); padding: 25px; }
.modal::backdrop { background: rgba(21, 32, 58, .45); backdrop-filter: blur(3px); }
.modal-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.icon-button { width: 34px; height: 34px; border: 0; border-radius: 9px; background: #f0f3f8; color: #5c6880; cursor: pointer; font-size: 22px; }
.modal label { display: block; margin-bottom: 14px; }
.modal label input, .modal label select, .modal label textarea { width: 100%; }
.modal textarea { min-height: 170px; resize: vertical; }
.links-preview { display: grid; max-height: 220px; margin: -4px 0 14px; gap: 7px; overflow: auto; }
.link-choice { display: grid !important; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; margin: 0 !important; gap: 8px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; }
.link-choice input { width: 17px !important; min-height: 17px; }
.link-choice span { margin: 0; color: var(--ink); font-size: 12px; }
.link-choice small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.modal-check { align-self: end; min-height: 43px; margin-bottom: 14px !important; }
.hint { border-radius: 11px; background: #f1f5fd; color: #5d6a84; font-size: 12px; line-height: 1.5; padding: 11px 13px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 20px; }
.history-modal { width: min(820px, calc(100% - 24px)); }
.chart { min-height: 240px; border: 1px solid var(--line); border-radius: 14px; background: #fbfcfe; overflow: hidden; }
.chart svg { display: block; width: 100%; height: 250px; }
.chart-legend { display: flex; gap: 18px; margin: 10px 2px 18px; color: var(--muted); font-size: 12px; }
.legend-dot { display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 50%; }
.legend-dot.bank { background: #005bff; }
.legend-dot.regular { background: #7e8ca8; }
.history-list { max-height: 260px; overflow: auto; }
.history-row { display: grid; grid-template-columns: 1fr auto auto; gap: 15px; border-bottom: 1px solid #edf0f5; font-size: 12px; padding: 10px 2px; }
.history-row.error { color: var(--red); }

.rentability-shell { width: min(1540px, calc(100% - 36px)); }
.rentability-summary { grid-template-columns: repeat(4, 1fr); }
.rentability-summary .summary-card strong { font-size: clamp(24px, 2.4vw, 34px); }
.rentability-panel { scroll-margin-top: 88px; }
.spp-panel { margin-bottom: 18px; }
.spp-summary { grid-template-columns: repeat(4, 1fr); margin: 18px 0; }
.spp-average-card { border-color: #9fc0ff; background: #f2f7ff; }
.spp-average-card strong { color: var(--blue); }
.spp-table-wrap { max-height: 560px; border: 1px solid var(--line); border-radius: 13px; }
.spp-table { min-width: 1120px; font-variant-numeric: tabular-nums; }
.spp-table th { position: sticky; z-index: 2; top: 0; background: #f5f7fb; white-space: nowrap; }
.spp-table th:first-child, .spp-table td:first-child { width: 390px; text-align: left; }
.spp-table td { text-align: right; white-space: nowrap; }
.spp-table td:first-child a { display: block; max-width: 390px; overflow: hidden; color: var(--ink); font-weight: 750; text-overflow: ellipsis; text-decoration: none; }
.spp-value { font-weight: 850; }
.spp-formula { margin: 12px 2px 0; }
.rentability-heading { align-items: flex-end; }
.rentability-filters { display: grid; grid-template-columns: minmax(220px, 1.35fr) minmax(170px, .9fr) minmax(190px, 1fr) auto; gap: 9px; }
.column-picker { position: relative; z-index: 6; }
.column-picker > summary { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 42px; list-style: none; cursor: pointer; white-space: nowrap; }
.column-picker > summary::-webkit-details-marker { display: none; }
.column-picker[open] > summary { border-color: var(--blue); box-shadow: 0 0 0 2px rgba(0, 91, 255, .1); }
.column-picker-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: min(520px, calc(100vw - 42px));
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(21, 32, 58, .16);
  padding: 15px;
}
.column-picker-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 16px; max-height: 330px; margin: 12px 0; overflow: auto; }
.column-picker-option { display: flex; align-items: center; gap: 8px; min-width: 0; color: #42506b; font-size: 12px; cursor: pointer; }
.column-picker-option input { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; accent-color: var(--blue); }
.column-picker-option span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.scenario-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: -4px 0 16px;
  border: 1px solid #bfd0f3;
  border-radius: 12px;
  background: #f4f7ff;
  padding: 11px 13px;
}
.scenario-copy { display: flex; align-items: center; gap: 10px; min-width: 0; }
.scenario-copy p { margin: 0; color: #526079; font-size: 12px; line-height: 1.45; }
.scenario-badge { flex: 0 0 auto; border-radius: 999px; background: #dce8ff; color: var(--blue); font-size: 11px; font-weight: 850; padding: 5px 9px; }
.scenario-actions { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.scenario-actions .compact { margin: 0; }
.rentability-table-wrap { max-height: min(68vh, 760px); border: 1px solid var(--line); border-radius: 13px; }
.rentability-table { min-width: 2600px; font-variant-numeric: tabular-nums; }
.rentability-table [hidden] { display: none !important; }
.rentability-table th { position: sticky; z-index: 2; top: 0; background: #f5f7fb; white-space: nowrap; }
.rentability-table td { color: #48525a; font-size: 12px; text-align: right; white-space: nowrap; }
.rentability-table th:first-child, .rentability-table th:nth-child(2),
.rentability-table td:first-child, .rentability-table td:nth-child(2) { text-align: left; }
.rentability-table th:first-child, .rentability-table td:first-child { width: 160px; }
.rentability-table th:nth-child(2), .rentability-table td:nth-child(2) { width: 440px; }
.rentability-name { max-width: 440px; overflow: hidden; text-overflow: ellipsis; }
.article-cell { color: var(--ink) !important; font-weight: 700; }
.assumption-cell { background: #fff8dc; }
.scenario-cell { background: #f5f8ff; padding: 7px 8px; }
.scenario-input, .scenario-select {
  width: 104px;
  min-height: 32px;
  border-color: #a9bfe9;
  border-radius: 8px;
  background: #fff;
  color: #31405c;
  font-size: 12px;
  text-align: right;
  padding: 5px 8px;
}
.scenario-input:focus, .scenario-select:focus { border-color: var(--blue); box-shadow: 0 0 0 2px rgba(0, 91, 255, .12); }
.scenario-input.is-modified, .scenario-select.is-modified { border-color: var(--blue); background: #eaf1ff; color: #154ba7; font-weight: 750; }
.scenario-select { width: 190px; text-align: left; }
.scenario-cell.missing-value .scenario-input { border-color: #d69b28; background: #fff8e9; }
.emphasis-cell { font-weight: 850; }
.negative-value { background: #fde9e7; color: #c00000 !important; }
.positive-value { background: #e2f0d9; color: #008000 !important; }
.missing-value { background: #fff0d6; color: var(--amber) !important; font-weight: 750; }
.loss-row td:first-child { box-shadow: inset 3px 0 0 #e9a4af; }
.yesterday-formula { margin: 10px 2px 0; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 18px; }

.poznayun-shell { width: min(1120px, calc(100% - 36px)); }
.poznayun-mark { background: linear-gradient(145deg, #6b4eff, #005bff); }
.poznayun-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 24px;
  border-radius: 24px;
  background: radial-gradient(circle at 90% 10%, rgba(111, 78, 255, .28), transparent 34%), linear-gradient(135deg, #121b35, #1c2e5d);
  color: #fff;
  padding: clamp(24px, 5vw, 48px);
  box-shadow: 0 22px 60px rgba(17, 31, 67, .18);
}
.poznayun-hero .eyebrow { color: #9dbbff; }
.poznayun-hero .muted { max-width: 690px; margin: 0; color: #cbd6ef; }
.token-badge { display: grid; min-width: 150px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 18px; background: rgba(255, 255, 255, .1); color: #dce6ff; text-align: center; padding: 16px; }
.token-badge strong { color: #fff; font-size: 34px; line-height: 1; }
.poznayun-summary { grid-template-columns: repeat(4, 1fr); }
.poznayun-summary .summary-card strong { font-size: 30px; }
.local-card { border-color: #bdcff7; background: #f4f7ff; }
.local-card strong { color: var(--blue); font-size: 25px !important; }
.ask-panel { padding: 28px; }
.ask-form > label { display: block; margin-bottom: 8px; color: #515d75; font-size: 12px; font-weight: 750; }
.ask-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; gap: 10px; }
.ask-row textarea { min-height: 92px; resize: vertical; font-size: 16px; line-height: 1.5; padding: 14px; }
.ask-row .button { min-width: 140px; }
.photo-tools { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(260px, 1fr); gap: 10px; margin-top: 12px; }
.photo-upload { display: flex; align-items: center; gap: 11px; min-height: 64px; border: 1px dashed #9eb5e8; border-radius: 14px; background: #f5f8ff; color: var(--blue); cursor: pointer; padding: 10px 13px; transition: border-color .16s ease, background .16s ease; }
.photo-upload:hover { border-color: var(--blue); background: #edf3ff; }
.photo-upload:focus-within { outline: 3px solid rgba(0, 91, 255, .18); outline-offset: 2px; }
.photo-upload input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.photo-upload-icon { display: grid; flex: 0 0 auto; width: 36px; height: 36px; place-items: center; border-radius: 11px; background: #dfe9ff; font-size: 23px; line-height: 1; }
.photo-upload > span:last-child { display: grid; gap: 3px; }
.photo-upload strong { font-size: 13px; }
.photo-upload small, .serial-number-field > span, .photo-preview small, .photo-hint { color: var(--muted); font-size: 11px; }
.serial-number-field { display: grid; align-content: center; gap: 6px; min-height: 64px; border: 1px solid #d7dfed; border-radius: 14px; background: #fff; padding: 9px 13px; }
.serial-number-field > span { font-weight: 700; }
.serial-number-field input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 14px; padding: 0; }
.photo-preview { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-top: 10px; border: 1px solid #cdd9ee; border-radius: 14px; background: #fbfcff; padding: 9px 11px; }
.photo-preview[hidden] { display: none; }
.photo-preview img { width: 58px; height: 58px; border-radius: 10px; background: #eef2f8; object-fit: cover; }
.photo-preview > div { display: grid; min-width: 0; gap: 4px; }
.photo-preview strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.photo-preview .button.compact { min-height: 36px; padding: 7px 10px; }
.photo-hint { margin: 8px 2px 0; line-height: 1.45; }
.example-questions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.example-questions button { border: 1px solid #d6deec; border-radius: 999px; background: #f7f9fd; color: #526078; cursor: pointer; font-size: 12px; padding: 7px 11px; }
.answer-panel { min-height: 220px; }
.empty-answer, .answer-heading { display: flex; align-items: flex-start; gap: 15px; }
.empty-answer { min-height: 170px; align-items: center; justify-content: center; }
.empty-answer h2, .answer-heading h2 { margin: 0; line-height: 1.4; }
.empty-answer p { margin: 6px 0 0; }
.answer-orb { display: grid; flex: 0 0 auto; width: 48px; height: 48px; place-items: center; border-radius: 16px; background: linear-gradient(145deg, #6b4eff, #005bff); color: #fff; font-size: 21px; font-weight: 850; }
.error-answer .answer-orb { background: var(--red); }
.answer-loading { min-height: 170px; display: grid; place-items: center; color: var(--muted); }
.answer-heading { margin-bottom: 20px; }
.answer-heading .eyebrow { margin: 2px 0 5px; }
.answer-heading h2 { font-size: 18px; font-weight: 650; }
.answer-heading > div { min-width: 0; flex: 1; }
.answer-mode-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.answer-mode-badge { flex: 0 0 auto; border-radius: 999px; font-size: 10px; font-weight: 800; padding: 6px 9px; }
.answer-mode-badge.local { background: #e8f7ee; color: #087a43; }
.answer-mode-badge.ai { background: #eeeaff; color: #5840bd; }
.answer-copy { color: var(--ink); font-size: 16px; font-weight: 600; line-height: 1.65; white-space: pre-line; }
.knowledge-card { border: 1px solid var(--line); border-radius: 16px; background: #fafbfe; padding: 18px; }
.knowledge-card + .knowledge-card { margin-top: 12px; }
.product-choice { display: block; width: 100%; color: inherit; cursor: pointer; font: inherit; text-align: left; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease; }
.product-choice:hover { border-color: #8eabf2; background: #fff; box-shadow: 0 9px 24px rgba(36, 73, 148, .1); transform: translateY(-1px); }
.product-choice:active { transform: translateY(0); }
.product-choice:focus-visible { outline: 3px solid rgba(0, 91, 255, .22); outline-offset: 2px; }
.product-choice .knowledge-head { width: 100%; }
.product-choice-copy { display: grid; gap: 4px; min-width: 0; }
.product-choice-action { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 6px; border-radius: 999px; background: #e9efff; color: var(--blue) !important; font-size: 12px !important; font-weight: 800; padding: 7px 11px; transition: background .16s ease, color .16s ease; }
.product-choice:hover .product-choice-action { background: var(--blue); color: #fff !important; }
.show-all-products { display: flex; width: 100%; align-items: center; justify-content: center; gap: 8px; margin-top: 12px; border: 1px solid #9eb8ef; border-radius: 13px; background: #eef4ff; color: var(--blue); cursor: pointer; font: inherit; font-size: 13px; font-weight: 800; padding: 12px 16px; }
.show-all-products:hover { border-color: var(--blue); background: #e4edff; }
.general-guide-card { border-color: #b9ccef; background: #f7f9ff; }
.general-guide-card .guide-answer { margin-top: 16px; }
.knowledge-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.knowledge-head > div { display: grid; gap: 4px; }
.knowledge-head strong { font-size: 17px; }
.knowledge-head span { color: var(--muted); font-size: 12px; }
.factory-picker { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr); gap: 16px; margin-top: 16px; border: 1px solid #bdd0fb; border-radius: 14px; background: #f1f5ff; padding: 15px; }
.factory-picker.required { border-color: #efcf91; background: #fff8e8; }
.factory-picker-copy { display: grid; align-content: start; gap: 4px; }
.factory-picker-copy > span { color: var(--blue); font-size: 10px; font-weight: 850; letter-spacing: .06em; }
.factory-picker.required .factory-picker-copy > span { color: #9a6500; }
.factory-picker-copy strong { color: var(--ink); font-size: 14px; }
.factory-picker-copy p { margin: 0; color: #5b6780; font-size: 12px; line-height: 1.5; }
.factory-picker-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; }
.factory-picker-controls label { display: grid; gap: 5px; }
.factory-picker-controls label > span { color: var(--muted); font-size: 10px; font-weight: 700; }
.factory-picker-controls select { width: 100%; min-height: 42px; border: 1px solid #c8d4e9; border-radius: 10px; background: #fff; color: var(--ink); padding: 0 10px; }
.factory-picker-controls .button { min-height: 42px; white-space: nowrap; }
.guide-answer { display: grid; gap: 16px; margin-top: 18px; }
.guide-section { border-radius: 14px; background: #fff; padding: 16px; }
.guide-section h3 { margin: 0 0 10px; color: #24304a; font-size: 14px; }
.capability-summary { margin: 0; color: #4e5d78; font-size: 13px; line-height: 1.6; }
.capability-answer .fact-grid { margin-top: 0; }
.faq-summary { border: 1px solid #c9d8fb; background: #f5f8ff; }
.faq-label { display: block; margin-bottom: 8px; color: var(--blue); font-size: 10px; font-weight: 850; letter-spacing: .08em; }
.faq-limitations { border: 1px solid #d7dfed; border-radius: 13px; background: #f7f9fc; padding: 15px; }
.faq-limitations > strong { display: block; margin-bottom: 9px; color: #53617b; font-size: 13px; }
.faq-limitations ul { display: grid; gap: 8px; margin: 0; padding-left: 20px; }
.faq-limitations li { color: #5f6b82; font-size: 13px; line-height: 1.55; }
.guide-section ul, .guide-warnings ul { display: grid; gap: 8px; margin: 0; padding-left: 20px; }
.guide-section li, .guide-warnings li { color: #4e5d78; font-size: 13px; line-height: 1.55; }
.guide-steps { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; counter-reset: guide-step; }
.guide-steps li { display: grid; grid-template-columns: 34px 1fr; align-items: start; gap: 10px; counter-increment: guide-step; }
.guide-steps li::before { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 10px; background: #e9efff; color: var(--blue); content: counter(guide-step); font-size: 12px; font-weight: 850; }
.guide-steps strong { color: var(--ink); font-size: 13px; }
.guide-steps p, .guide-notes p { margin: 4px 0 0; color: #4e5d78; font-size: 13px; line-height: 1.55; }
.guide-notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.guide-notes article { border: 1px solid #cbd7ee; border-radius: 12px; background: #f4f7fd; padding: 13px; }
.guide-notes strong { color: #293959; font-size: 12px; }
.guide-warnings { border: 1px solid #efcf91; border-radius: 13px; background: #fff8e8; padding: 15px; }
.guide-warnings > strong { display: block; margin-bottom: 9px; color: #9a6500; font-size: 13px; }
.guide-warnings li { color: #6d5b39; }
.guide-source { display: grid; grid-template-columns: 72px 1fr; gap: 3px 10px; border: 1px solid #d7dfed; border-radius: 12px; background: #fff; color: var(--ink); text-decoration: none; padding: 12px; }
.guide-source > span { grid-row: 1 / 3; align-self: center; color: var(--blue); font-size: 11px; font-weight: 850; text-transform: uppercase; }
.guide-source strong { font-size: 12px; }
.guide-source small { color: var(--muted); font-size: 10px; }
.related-products { display: grid; gap: 12px; margin-top: 18px; border: 1px solid #cfe5d8; border-radius: 16px; background: #f1fbf5; padding: 16px; }
.related-products-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.related-products-head span { color: #087a43; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.related-products-head strong { color: #325d45; font-size: 12px; }
.related-products-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.related-product { display: grid; gap: 7px; border: 1px solid #d8eadf; border-radius: 13px; background: #fff; padding: 13px; }
.related-product > div { display: grid; gap: 3px; }
.related-product strong { color: var(--ink); font-size: 13px; line-height: 1.4; }
.related-product span, .related-product small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.related-product p { margin: 0; color: #435d4c; font-size: 12px; line-height: 1.5; }
.related-product .oil-usage { display: grid; gap: 3px; border-left: 3px solid #13a05c; border-radius: 8px; background: #edf9f2; padding: 9px 10px; }
.related-product .oil-usage strong { color: #087a43; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.related-product .oil-usage span { color: var(--ink); font-size: 13px; font-weight: 800; }
.related-product .oil-usage small { color: #435d4c; font-size: 10px; }
.related-product a { width: fit-content; color: var(--blue); font-size: 11px; font-weight: 800; text-decoration: none; }
.fact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin: 16px 0 0; }
.fact-grid div { border-radius: 11px; background: #fff; padding: 12px; }
.fact-grid dt { color: var(--muted); font-size: 11px; }
.fact-grid dd { margin: 4px 0; color: var(--ink); font-size: 14px; font-weight: 750; }
.fact-grid small { color: #8a94a8; font-size: 10px; }
.knowledge-details { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 13px; }
.knowledge-details summary { cursor: pointer; color: var(--blue); font-size: 13px; font-weight: 750; }
.material-list { display: grid; gap: 7px; margin-top: 10px; }
.material-list a { display: grid; grid-template-columns: 74px 1fr; gap: 3px 10px; border-radius: 10px; background: #fff; color: var(--ink); text-decoration: none; padding: 10px; }
.material-list a > span { grid-row: 1 / 3; align-self: center; color: var(--blue); font-size: 11px; font-weight: 800; }
.material-list a strong { font-size: 12px; }
.material-list a small { color: var(--muted); font-size: 10px; }
.conflict-list { margin-top: 14px; border: 1px solid #f1d49a; border-radius: 11px; background: #fff9e9; padding: 12px; }
.conflict-list strong { color: var(--amber); font-size: 12px; }
.conflict-list p { margin: 5px 0 0; color: #6f603f; font-size: 12px; line-height: 1.5; }
.answer-warnings { display: grid; gap: 5px; margin-top: 14px; color: var(--muted); font-size: 11px; }
.answer-warnings p { margin: 0; }
.poznayun-note { border: 1px solid #cbd7ee; border-radius: 15px; background: #f4f7fd; color: #4e5d78; padding: 16px 18px; }
.poznayun-note strong { color: var(--ink); font-size: 13px; }
.poznayun-note p { margin: 5px 0 0; font-size: 12px; line-height: 1.5; }

.fbs-shell { width: min(1240px, calc(100% - 36px)); }
.fbs-mark { background: linear-gradient(145deg, #005bff, #00a6ff); }
.compact-token { min-width: 104px; grid-template-columns: auto auto; align-items: center; gap: 7px; border-color: #ccdaf7; background: #f1f6ff; color: #42618d; padding: 10px 13px; }
.compact-token strong { color: var(--blue); font-size: 24px; }
.fbs-summary { grid-template-columns: repeat(3, 1fr); }
.vehicle-card { border-color: #a9c2f3; background: linear-gradient(145deg, #f7faff, #eaf2ff); }
.vehicle-card strong { color: var(--blue); }
.fbs-status-panel { background: #fbfcff; }
.integration-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.integration-grid > div { display: grid; gap: 5px; border: 1px solid var(--line); border-radius: 12px; background: #fff; padding: 13px 15px; }
.integration-grid span { color: var(--muted); font-size: 11px; }
.integration-grid strong { font-size: 14px; }
.integration-on { color: var(--green); }
.integration-off { color: var(--amber); }
.route-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.route-card { border: 1px solid #ccd9f1; border-radius: 16px; background: linear-gradient(145deg, #fff, #f5f8fe); padding: 18px; }
.route-card h3 { margin: 2px 0 15px; font-size: 17px; }
.route-card dl { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; margin: 0; }
.route-card dl > div { border-radius: 10px; background: #fff; padding: 9px; }
.route-card dt { color: var(--muted); font-size: 10px; }
.route-card dd { margin: 5px 0 0; color: var(--ink); font-size: 14px; font-weight: 800; }
.route-card .route-vehicle { background: #eaf2ff; }
.route-card .route-vehicle dd { color: var(--blue); font-size: 20px; }
.fbs-table td:nth-child(n+3) { font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.fbs-table td:first-child { min-width: 390px; }
.fbs-table td:first-child strong, .fbs-table td:first-child small { display: block; }
.fbs-table td:first-child small { margin-top: 4px; color: var(--muted); }
.fbs-page-size { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 12px; }
.fbs-page-size select { min-width: 82px; }
.fbs-pagination { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 16px; }
.fbs-pagination .muted { min-width: 180px; text-align: center; }
.fbs-note { border: 1px solid #ccd9f1; border-radius: 14px; background: #f5f8fe; color: #53617a; font-size: 12px; line-height: 1.55; padding: 14px 17px; }

.home-shell { width: min(1060px, calc(100% - 36px)); }
.home-hero { display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; margin-bottom: 38px; border: 1px solid #d6e1f6; border-radius: 24px; background: linear-gradient(135deg, #fff 35%, #eef4ff); box-shadow: 0 20px 55px rgba(25, 57, 118, .07); padding: clamp(25px, 5vw, 48px); }
.home-hero h1 { margin-bottom: 12px; }
.home-hero .muted { max-width: 660px; margin-bottom: 0; }
.section-title-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin: 0 4px 17px; }
.module-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.module-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; min-height: 168px; gap: 18px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 15px 44px rgba(28, 42, 72, .065); padding: 25px; text-decoration: none; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.module-card:hover { transform: translateY(-3px); border-color: #abc4f6; box-shadow: 0 20px 50px rgba(28, 68, 146, .12); }
.module-icon { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 19px; background: linear-gradient(145deg, #005bff, #00a6ff); color: #fff; font-size: 27px; font-weight: 900; }
.poznayun-module .module-icon { background: linear-gradient(145deg, #6e43d7, #9a66f0); }
.module-copy { display: grid; gap: 7px; }
.module-copy strong { font-size: 24px; letter-spacing: -.025em; }
.module-copy small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.module-arrow { color: var(--blue); font-size: 28px; }
.owner-panel { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-top: 28px; border: 1px dashed #b8c7df; border-radius: 18px; background: #f8faff; padding: 21px 23px; }
.owner-panel h2 { font-size: 19px; }
.owner-panel .button { flex: 0 0 auto; text-decoration: none; }

.users-shell { width: min(1180px, calc(100% - 36px)); }
.users-table { min-width: 980px; }
.users-table td:first-child strong { display: block; }
.users-table td code { border-radius: 7px; background: #f1f4f9; color: #40506d; padding: 4px 7px; }
.owner-label { display: block; margin-top: 4px; color: var(--blue); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.permission-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.permission-fieldset { display: grid; gap: 9px; margin: 4px 0 16px; border: 1px solid var(--line); border-radius: 13px; padding: 13px; }
.permission-fieldset legend { color: #515d75; font-size: 12px; font-weight: 750; padding: 0 5px; }
.permission-choice { display: grid !important; grid-template-columns: auto 1fr; align-items: center; margin: 0 !important; gap: 10px; border-radius: 10px; background: #f7f9fd; cursor: pointer; padding: 10px 11px; }
.permission-choice input { width: 18px !important; min-height: 18px; }
.permission-choice > span { display: grid; margin: 0; gap: 2px; }
.permission-choice strong { color: var(--ink); font-size: 13px; }
.permission-choice small { color: var(--muted); font-size: 11px; }
.access-note { border: 1px solid #d8dfeb; border-radius: 14px; background: #f6f8fb; color: #5b667b; padding: 15px 17px; }
.access-note strong { color: var(--ink); font-size: 13px; }
.access-note p { margin: 5px 0 0; font-size: 12px; line-height: 1.55; }

.profile-shell { width: min(760px, calc(100% - 36px)); }
.profile-panel { max-width: 620px; }
.profile-form { display: grid; gap: 16px; }
.profile-form input { width: 100%; }
.profile-form .hint { margin: -2px 0 0; }
.login-notice { margin: 16px 0 -2px; font-size: 13px; }

.login-page { display: grid; min-height: 100vh; place-items: center; background: radial-gradient(circle at 25% 15%, #e3edff, transparent 34%), #f4f7fc; padding: 20px; }
.login-card { width: min(430px, 100%); border: 1px solid var(--line); border-radius: 24px; background: #fff; box-shadow: 0 25px 70px rgba(21, 32, 58, .1); padding: 34px; }
.login-card .brand-mark { margin-bottom: 25px; }
.login-card h1 { font-size: 32px; }
.login-form { display: grid; gap: 16px; margin-top: 25px; }
.login-form input { width: 100%; }
.form-error { margin: -5px 0 0; color: var(--red); font-size: 13px; }

@media (max-width: 900px) {
  .module-grid { grid-template-columns: 1fr; }
  .summary-grid { grid-template-columns: 1fr 1fr; }
  .rentability-summary { grid-template-columns: 1fr 1fr; }
  .spp-summary { grid-template-columns: 1fr 1fr; }
  .two-column { grid-template-columns: 1fr; }
  .store-grid { grid-template-columns: 1fr; }
  .rentability-heading { align-items: stretch; flex-direction: column; }
  .rentability-filters { grid-template-columns: 1fr; }
  .column-picker-menu { right: auto; left: 0; }
  .scenario-toolbar { align-items: flex-start; flex-direction: column; }
  .scenario-actions { width: 100%; justify-content: space-between; }
  .poznayun-summary { grid-template-columns: 1fr 1fr; }
  .fbs-summary { grid-template-columns: 1fr 1fr; }
  .route-grid { grid-template-columns: 1fr; }
  .route-card dl { grid-template-columns: repeat(3, 1fr); }
  .factory-picker { grid-template-columns: 1fr; }
}

@media (max-width: 650px) {
  .topbar { min-height: 62px; padding: 9px 12px; }
  .brand small { display: none; }
  .brand-mark.small { width: 38px; height: 38px; }
  .topbar-actions { gap: 4px; }
  .topbar .button { padding-inline: 8px; }
  .topbar .nav-link { font-size: 12px; }
  .topbar .profile-link { display: none; }
  .user-chip { display: none; }
  .dashboard-shell { width: min(100% - 20px, 1260px); margin-top: 22px; }
  .page-heading, .panel-heading, .products-heading { align-items: stretch; flex-direction: column; }
  .heading-actions, .filters { display: grid; grid-template-columns: 1fr 1fr; }
  .heading-actions .button:first-child { grid-column: 1 / -1; }
  .summary-grid { gap: 9px; }
  .rentability-summary { grid-template-columns: 1fr; }
  .column-picker-options { grid-template-columns: 1fr; }
  .spp-summary { grid-template-columns: 1fr; }
  .summary-card { min-height: 108px; padding: 15px; }
  .summary-card strong { font-size: 29px; }
  .panel { border-radius: 15px; padding: 16px; }
  .store-meta { grid-template-columns: 1fr 1fr; }
  .settings-form, .form-grid { grid-template-columns: 1fr; }
  .settings-form label, .settings-form .form-actions, .settings-form .compact, .check-line { grid-column: auto; }
  .settings-form .form-actions { align-items: stretch; flex-direction: column; }
  .modal { padding: 18px; }
  .history-row { grid-template-columns: 1fr 1fr; }
  .history-row span:first-child { grid-column: 1 / -1; }
  .scenario-copy { align-items: flex-start; flex-direction: column; }
  .scenario-actions { align-items: stretch; flex-direction: column; }
  .poznayun-hero { align-items: stretch; flex-direction: column; }
  .token-badge { min-width: 0; }
  .poznayun-summary { grid-template-columns: 1fr; }
  .fbs-summary, .integration-grid { grid-template-columns: 1fr; }
  .route-card dl { grid-template-columns: 1fr 1fr; }
  .fbs-page-size { justify-content: space-between; }
  .fbs-pagination { display: grid; grid-template-columns: 1fr 1fr; }
  .fbs-pagination .muted { grid-column: 1 / -1; grid-row: 1; min-width: 0; }
  .ask-row { grid-template-columns: 1fr; }
  .ask-row .button { min-height: 48px; }
  .photo-tools { grid-template-columns: 1fr; }
  .photo-preview { grid-template-columns: 50px minmax(0, 1fr); }
  .photo-preview img { width: 50px; height: 50px; }
  .photo-preview .button { grid-column: 1 / -1; width: 100%; }
  .fact-grid { grid-template-columns: 1fr; }
  .guide-notes { grid-template-columns: 1fr; }
  .related-products-grid { grid-template-columns: 1fr; }
  .guide-source { grid-template-columns: 1fr; }
  .guide-source > span { grid-row: auto; }
  .factory-picker-controls { grid-template-columns: 1fr; }
  .knowledge-head { flex-direction: column; }
  .material-list a { grid-template-columns: 1fr; }
  .material-list a > span { grid-row: auto; }
  .home-hero, .owner-panel { align-items: stretch; flex-direction: column; }
  .home-hero { margin-bottom: 26px; border-radius: 18px; padding: 24px 20px; }
  .module-card { min-height: 138px; grid-template-columns: auto 1fr; padding: 19px; }
  .module-icon { width: 52px; height: 52px; border-radius: 15px; font-size: 23px; }
  .module-arrow { display: none; }
}