:root {
  --oa-purple: #6427d9;
  --oa-purple-dark: #45207e;
  --oa-blue: #466fae;
  --oa-green: #257551;
  --oa-line: #e5e0e9;
  --oa-line-soft: #eeeaf1;
  --oa-muted: #817a86;
  --oa-ink: #302a35;
  --oa-surface: #fff;
  --oa-surface-soft: #fbfafc;
}

.operations-analysis-page { width: 100%; margin: 0; padding: 0 0 18px; }
.operations-analysis-heading { margin-bottom: 7px; padding: 7px 8px; border: 1px solid var(--oa-line); border-radius: 10px; background: #fff; box-shadow: 0 4px 16px rgba(46,26,70,.035); }
.operations-analysis-source { display: grid; grid-template-columns: minmax(185px,220px) auto auto; align-items: center; justify-content: end; gap: 6px; }
.operations-analysis-source > span { display: flex; height: 30px; min-width: 0; align-items: center; padding: 0 9px; border: 1px solid var(--oa-line); border-radius: 7px; overflow: hidden; background: #fff; color: #716a76; font-size: 10px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }

.oa-store-disclosure { position: relative; min-width: 0; }
.oa-store-disclosure summary { display: grid; height: 30px; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 7px; padding: 0 9px; border: 1px solid #d8cbea; border-radius: 7px; background: #f8f4fd; color: var(--oa-purple-dark); font-size: 10px; cursor: pointer; list-style: none; }
.oa-store-disclosure summary::-webkit-details-marker { display: none; }
.oa-store-disclosure summary > span { font-weight: 650; white-space: nowrap; }
.oa-store-disclosure summary > b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.oa-store-disclosure summary > small { color: #7650a3; font-size: 9px; font-weight: 700; white-space: nowrap; }
.oa-store-disclosure summary > i { color: #8d70af; font-size: 10px; font-style: normal; line-height: 1; transition: transform .16s ease; }
.oa-store-disclosure[open] summary { border-color: #ad91d5; background: #f4eefb; }
.oa-store-disclosure[open] summary > i { transform: rotate(180deg); }
.oa-store-panel { position: absolute; top: calc(100% + 6px); right: 0; z-index: 50; width: min(820px,calc(100vw - 320px)); min-width: 520px; padding: 12px; border: 1px solid #d9cde8; border-radius: 11px; background: #fff; box-shadow: 0 18px 45px rgba(51,26,83,.17); }
.oa-store-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 9px; padding: 0 2px; }
.oa-store-panel-heading b { color: #39313f; font-size: 11px; }
.oa-store-panel-heading span { color: #83798d; font-size: 10px; }
.oa-store-grid { display: grid; max-height: 250px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; overflow: auto; overscroll-behavior: contain; }
.oa-store-item { display: flex; min-width: 0; min-height: 34px; align-items: center; gap: 7px; padding: 7px 9px; border: 1px solid #e9e3ef; border-radius: 7px; background: #fbf9fd; color: #554b5f; font-size: 10px; line-height: 1.35; overflow-wrap: anywhere; }
.oa-store-item::before { width: 5px; height: 5px; flex: 0 0 auto; border-radius: 50%; background: #8150c7; box-shadow: 0 0 0 3px rgba(129,80,199,.1); content: ""; }
.oa-store-empty { grid-column: 1 / -1; padding: 16px; border: 1px dashed #ddd4e7; border-radius: 8px; color: #8a828f; font-size: 10px; text-align: center; }

.operations-analysis-toolbar { display: flex; align-items: flex-end; gap: 7px; flex-wrap: wrap; margin-bottom: 7px; padding: 8px; border: 1px solid var(--oa-line); border-radius: 10px; background: #fff; box-shadow: 0 4px 16px rgba(46,26,70,.03); }
.operations-analysis-search { display: flex; min-width: 280px; flex: 1 1 330px; align-items: center; gap: 8px; color: #5f5966; font-size: 10px; font-weight: 750; }
.operations-analysis-search > span { flex: 0 0 auto; padding-left: 2px; white-space: nowrap; }
.operations-analysis-search input { width: 100%; height: 32px; padding: 0 10px; border: 1px solid #dfdbe5; border-radius: 8px; outline: 0; background: #fcfbfd; color: #302c34; font-size: 11px; }
.operations-analysis-search input:focus,.operations-analysis-sort-field select:focus { border-color: #9d76d7; box-shadow: 0 0 0 3px rgba(100,39,217,.07); }
.operations-analysis-sort-field { display: grid; flex: 0 1 125px; gap: 3px; color: #78717e; font-size: 10px; font-weight: 700; }
.operations-analysis-sort-field select { width: 100%; min-width: 108px; height: 32px; padding: 0 25px 0 9px; border: 1px solid #dfdbe5; border-radius: 8px; outline: 0; background: #fcfbfd; color: #4f4856; font-size: 11px; }
.operations-analysis-filter-actions { display: flex; flex: 0 0 auto; gap: 6px; margin-left: auto; white-space: nowrap; }
.operations-analysis-filter-actions button,.operations-analysis-pagination button { height: 32px; padding: 0 12px; border: 1px solid #ded8e6; border-radius: 8px; background: #fff; color: #625b69; font-size: 10px; font-weight: 750; cursor: pointer; }
.operations-analysis-filter-actions button:first-child { border-color: var(--oa-purple); background: var(--oa-purple); color: #fff; }
.operations-analysis-filter-actions button:disabled,.operations-analysis-pagination button:disabled { opacity: .45; cursor: default; }
.operations-analysis-result-line { display: flex; min-height: 26px; align-items: center; justify-content: space-between; gap: 12px; padding: 0 3px 5px; color: #77717d; font-size: 10px; }
.operations-analysis-result-line span:last-child { color: #5b3984; font-weight: 700; }

.operations-analysis-list-shell { position: relative; min-height: 390px; }
.operations-analysis-table-wrap { position: relative; width: 100%; max-height: calc(100vh - 245px); min-height: 390px; overflow: auto; overscroll-behavior: contain; border: 1px solid var(--oa-line); border-radius: 11px; background: #fff; box-shadow: 0 6px 22px rgba(44,24,71,.04); scrollbar-gutter: stable; }
.operations-analysis-table { width: max-content; min-width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; color: var(--oa-ink); font-size: 11px; }
.operations-analysis-table th { position: sticky; top: 0; z-index: 8; height: 38px; padding: 0 9px; border-right: 1px solid #e7e1eb; border-bottom: 1px solid #ddd6e3; background: #f6f3f8; color: #635b69; font-size: 10px; font-weight: 800; letter-spacing: .01em; text-align: left; white-space: nowrap; }
.operations-analysis-table th:last-child,.operations-analysis-table td:last-child { border-right: 0; }
.operations-analysis-table th.oa-period-column-heading { text-align: center; }
.operations-analysis-table th.oa-period-column-heading.yesterday { background: #f5effb; color: #65319c; }
.operations-analysis-table th.oa-period-column-heading.last-7-days { background: #eff4fa; color: #426a9e; }
.operations-analysis-table th.oa-period-column-heading.last-30-days { background: #eef7f2; color: #2e7658; }
.operations-analysis-table td { height: 62px; padding: 6px 8px; border-right: 1px solid #eeeaf1; border-bottom: 1px solid #eeeaf1; overflow: hidden; background: #fff; vertical-align: middle; }
.operations-analysis-table tbody tr:last-child td { border-bottom: 0; }
.oa-table-row:hover td { background: #fcfafd; }
.oa-table-row.is-pinned td { background: #fffdf7; }
.oa-table-row.is-pinned:hover td { background: #fffbf0; }

.oa-table-product { display: grid; min-width: 0; grid-template-columns: 24px minmax(0,1fr); align-items: center; gap: 7px; }
.oa-table-product > div { display: grid; min-width: 0; gap: 2px; }
.oa-table-product b { overflow: hidden; color: #322a39; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.oa-table-product small { overflow: hidden; color: #665c70; font-size: 9px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.oa-table-product span { overflow: hidden; color: #958e99; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.oa-table-pin { width: 24px; height: 24px; padding: 0; border: 1px solid #dfd8e6; border-radius: 6px; background: #fff; color: #9a8ba7; font-size: 13px; cursor: pointer; }
.oa-table-pin[aria-pressed="true"] { border-color: #e1c36d; background: #fff7dc; color: #a97800; }
.oa-table-tag { display: inline-flex; max-width: 100%; min-height: 22px; align-items: center; padding: 3px 7px; border-radius: 99px; overflow: hidden; background: #f0e9f8; color: #5c328a; font-size: 9px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.oa-table-image { display: grid; width: 48px; height: 48px; place-items: center; margin: auto; overflow: hidden; border: 1px solid #e8e2ed; border-radius: 7px; background: #f8f5fa; }
.oa-table-image img { width: 100%; height: 100%; object-fit: contain; cursor: zoom-in; }
.oa-table-image-missing { color: #aaa3af; font-size: 9px; }
.oa-table-sku-trigger,.oa-table-history-trigger { max-width: 100%; padding: 0; border: 0; background: transparent; color: #5f3b82; font: inherit; cursor: pointer; text-align: left; }
.oa-table-sku-trigger { display: flex; min-width: 0; align-items: center; gap: 5px; }
.oa-table-sku-trigger b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.oa-table-sku-trigger span { flex: 0 0 auto; padding: 2px 5px; border-radius: 99px; background: #eee7f6; font-size: 9px; font-weight: 750; }
.oa-table-history-trigger { width: 100%; color: #604184; font-size: 10px; font-weight: 750; text-align: center; }
.oa-table-sku-trigger:hover,.oa-table-sku-trigger:focus-visible,.oa-table-history-trigger:hover,.oa-table-history-trigger:focus-visible { color: var(--oa-purple); text-decoration: underline; text-underline-offset: 2px; }
.oa-table-link { display: inline-flex; min-height: 26px; align-items: center; justify-content: center; padding: 4px 6px; border: 1px solid #ded6e6; border-radius: 6px; background: #fff; color: #5c318a; font-size: 9px; font-weight: 750; text-decoration: none; white-space: nowrap; }
.oa-table-link:hover { border-color: #bba2dd; background: #faf7fd; }
.oa-table-number { display: block; overflow: hidden; font-size: 11px; font-variant-numeric: tabular-nums; font-weight: 750; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.is-missing { color: #aaa3ad!important; font-weight: 500!important; }

.oa-table-period-cell { padding: 5px!important; }
.oa-table-period-trigger { display: grid; width: 100%; min-height: 48px; align-content: center; gap: 2px; padding: 5px 7px; border: 1px solid #e0d6e9; border-radius: 7px; background: #faf7fd; color: #5e328a; cursor: pointer; text-align: left; }
.oa-table-period-trigger.last-7-days { border-color: #d6dfec; background: #f4f7fb; color: #456c9c; }
.oa-table-period-trigger.last-30-days { border-color: #d5e5dd; background: #f3f9f6; color: #2f7559; }
.oa-table-period-trigger:hover,.oa-table-period-trigger:focus-visible { border-color: currentColor; box-shadow: 0 0 0 2px rgba(100,39,217,.07); outline: 0; }
.oa-table-period-trigger b { font-size: 10px; }
.oa-table-period-trigger span { overflow: hidden; font-size: 10px; font-variant-numeric: tabular-nums; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.oa-table-period-trigger small { overflow: hidden; font-size: 8px; opacity: .8; text-overflow: ellipsis; white-space: nowrap; }

.oa-column-resizer { position: absolute; top: 0; right: -4px; z-index: 4; width: 8px; height: 100%; cursor: col-resize; touch-action: none; }
.oa-column-resizer::after { position: absolute; top: 8px; right: 3px; width: 1px; height: 22px; background: #d6cedc; content: ""; }
.oa-column-resizer:hover::after,.oa-resizing-column .oa-column-resizer::after { width: 2px; background: var(--oa-purple); }
.oa-resizing-column,.oa-resizing-column * { cursor: col-resize!important; user-select: none!important; }

.oa-hover-popover { position: fixed; z-index: 1000; width: min(340px,calc(100vw - 20px)); max-height: calc(100vh - 20px); padding: 0; overflow: auto; border: 1px solid #d9cde5; border-radius: 11px; background: #fff; box-shadow: 0 20px 55px rgba(43,23,65,.22); }
.oa-hover-popover[hidden] { display: none; }
.oa-popover-content { min-width: 0; }
.oa-popover-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border-bottom: 1px solid #e9e3ed; background: #faf8fc; }
.oa-popover-heading b { color: #403648; font-size: 12px; }
.oa-popover-heading span { color: #877e8d; font-size: 9px; text-align: right; }
.oa-popover-sku-list,.oa-popover-history-list { display: grid; max-height: 360px; gap: 6px; padding: 9px; overflow: auto; }
.oa-popover-sku-item { min-width: 0; padding: 8px 9px; border: 1px solid #eae5ee; border-radius: 7px; background: #fcfbfd; }
.oa-popover-sku-item > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.oa-popover-sku-item b { overflow: hidden; color: #413747; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.oa-popover-sku-item span { color: #867d8b; font-size: 9px; white-space: nowrap; }
.oa-popover-sku-item p { margin: 5px 0 0; color: #817987; font-size: 9px; line-height: 1.45; overflow-wrap: anywhere; }
.oa-popover-sku-item .oa-popover-quantities { color: #5d4475; font-weight: 650; }
.oa-popover-history-list > div { padding: 7px 8px; border-radius: 6px; background: #f7f4f9; color: #5d5364; font-size: 10px; line-height: 1.45; }
.oa-popover-empty { margin: 0; padding: 18px 12px; color: #8c8491; font-size: 10px; text-align: center; }
.oa-period-detail-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 11px 12px; border-bottom: 1px solid #dfd5e8; background: #f4eefb; color: #5f2c96; }
.oa-period-detail.last-7-days .oa-period-detail-heading { border-color: #d5deed; background: #eff3fa; color: #426a9e; }
.oa-period-detail.last-30-days .oa-period-detail-heading { border-color: #d6e6de; background: #eff8f3; color: #2e7658; }
.oa-period-detail-heading > div { display: grid; min-width: 0; gap: 3px; }
.oa-period-detail-heading > div:last-child { text-align: right; }
.oa-period-detail-heading b { font-size: 13px; }
.oa-period-detail-heading span,.oa-period-detail-heading small { overflow: hidden; font-size: 9px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.oa-period-detail-metrics { margin: 0; padding: 3px 0; }
.oa-period-detail-metrics > div { display: grid; min-height: 29px; grid-template-columns: minmax(80px,1fr) auto; align-items: center; gap: 10px; padding: 5px 12px; border-bottom: 1px solid #f0edf2; }
.oa-period-detail-metrics > div:last-child { border-bottom: 0; }
.oa-period-detail-metrics dt { color: #776f7d; font-size: 10px; }
.oa-period-detail-metrics dd { margin: 0; color: #3d3544; font-size: 11px; font-variant-numeric: tabular-nums; font-weight: 800; text-align: right; }

.operations-analysis-loading,.operations-analysis-empty { min-height: 310px; display: grid; place-content: center; justify-items: center; gap: 7px; border: 1px solid var(--oa-line); border-radius: 11px; background: #fff; color: #817a86; text-align: center; }
.operations-analysis-loading i { width: 24px; height: 24px; border: 3px solid #e6dff0; border-top-color: var(--oa-purple); border-radius: 50%; animation: oa-spin .8s linear infinite; }
.operations-analysis-loading b,.operations-analysis-empty b { color: #403748; font-size: 12px; }
.operations-analysis-loading span,.operations-analysis-empty p { margin: 0; color: #928b97; font-size: 11px; }
.operations-analysis-table-wrap:not(:empty) + .operations-analysis-loading { position: absolute; inset: 0; z-index: 20; min-height: 0; background: rgba(255,255,255,.84); backdrop-filter: blur(2px); }
@keyframes oa-spin { to { transform: rotate(360deg); } }
.operations-analysis-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 10px 0 4px; color: #79727e; font-size: 10px; }
.operations-analysis-footnote { margin: 7px 1px 0; padding: 8px 10px; border-left: 3px solid #b69bd7; background: #faf8fc; color: #817985; font-size: 9px; line-height: 1.6; }

.operations-analysis-column-dialog { width: min(760px,calc(100vw - 40px)); max-height: min(720px,calc(100vh - 40px)); padding: 0; border: 0; border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 28px 80px rgba(35,19,52,.24); }
.operations-analysis-column-dialog::backdrop { background: rgba(29,20,38,.48); backdrop-filter: blur(3px); }
.operations-analysis-column-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 18px 20px 14px; border-bottom: 1px solid #e9e4ec; }
.operations-analysis-column-heading span { color: var(--oa-purple); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.operations-analysis-column-heading h2 { margin: 5px 0 4px; color: #302a35; font-size: 20px; }
.operations-analysis-column-heading p { margin: 0; color: #88818c; font-size: 11px; line-height: 1.55; }
.operations-analysis-column-heading button { width: 31px; height: 31px; flex: 0 0 auto; border: 1px solid #e0d9e5; border-radius: 8px; background: #fff; color: #7f7785; font-size: 18px; cursor: pointer; }
.operations-analysis-column-actions { display: flex; align-items: center; gap: 7px; padding: 9px 20px; border-bottom: 1px solid #ece7ef; background: #fbfafc; }
.operations-analysis-column-actions > span { margin-right: auto; color: #716979; font-size: 11px; font-weight: 700; }
.operations-analysis-column-actions button,.operations-analysis-column-footer button { min-height: 31px; padding: 0 11px; border: 1px solid #ddd5e5; border-radius: 7px; background: #fff; color: #5e5268; font-size: 11px; font-weight: 700; cursor: pointer; }
.operations-analysis-column-list { max-height: 480px; padding: 14px 20px 18px; overflow: auto; }
.oa-preference-section + .oa-preference-section { margin-top: 16px; padding-top: 15px; border-top: 1px solid #ece7ef; }
.oa-preference-section h3 { margin: 0 0 9px; color: #4f4656; font-size: 12px; }
.oa-preference-options { display: grid; gap: 7px; }
.oa-preference-options.common-options { grid-template-columns: repeat(4,minmax(0,1fr)); }
.oa-preference-options.period-options { grid-template-columns: repeat(3,minmax(0,1fr)); }
.oa-preference-options.metric-options { grid-template-columns: repeat(4,minmax(0,1fr)); }
.oa-preference-option { display: flex; min-height: 36px; align-items: center; gap: 8px; padding: 7px 9px; border: 1px solid #e8e2ec; border-radius: 8px; background: #fcfbfd; color: #554c5d; font-size: 11px; cursor: pointer; }
.oa-preference-option input { accent-color: var(--oa-purple); }
.operations-analysis-column-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 20px 14px; border-top: 1px solid #ebe6ef; background: #fbfafc; }
.operations-analysis-column-footer span { color: #918b95; font-size: 10px; }
.operations-analysis-column-footer button { min-width: 82px; border-color: var(--oa-purple); background: var(--oa-purple); color: #fff; }

@media(max-width:1500px) {
  .operations-analysis-filter-actions { width: 100%; justify-content: flex-end; }
  .operations-analysis-table-wrap { max-height: calc(100vh - 285px); }
}
@media(max-width:950px) {
  .operations-analysis-source { grid-template-columns: minmax(170px,1fr) auto auto; }
  .oa-store-panel { right: auto; left: 0; width: min(680px,calc(100vw - 42px)); min-width: 0; }
  .oa-store-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .oa-preference-options.common-options,.oa-preference-options.metric-options { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media(max-width:780px) {
  .operations-analysis-active .workspace-content { padding: 10px 12px 18px; }
  .operations-analysis-heading { padding: 7px; }
  .operations-analysis-source { grid-template-columns: 1fr 1fr; }
  .oa-store-disclosure { grid-column: 1 / -1; }
  .oa-store-panel { width: calc(100vw - 38px); }
  .oa-store-grid { grid-template-columns: 1fr; }
  .operations-analysis-source > span { justify-content: center; }
  .operations-analysis-toolbar { align-items: stretch; }
  .operations-analysis-search { min-width: 100%; align-items: stretch; flex-direction: column; }
  .operations-analysis-sort-field { flex: 1 1 calc(33.333% - 6px); }
  .operations-analysis-filter-actions { justify-content: stretch; flex-wrap: wrap; }
  .operations-analysis-filter-actions button { flex: 1 1 calc(50% - 4px); }
  .operations-analysis-result-line { align-items: flex-start; flex-direction: column; gap: 4px; }
  .operations-analysis-table-wrap { max-height: calc(100vh - 360px); min-height: 330px; }
  .oa-hover-popover { width: calc(100vw - 24px); max-height: calc(100vh - 24px); }
  .oa-preference-options.common-options,.oa-preference-options.metric-options { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .operations-analysis-column-footer { align-items: stretch; flex-direction: column; }
  .operations-analysis-column-footer button { width: 100%; }
}
@media(max-width:520px) {
  .operations-analysis-source { grid-template-columns: 1fr; }
  .oa-store-disclosure { grid-column: auto; }
  .operations-analysis-source > span { justify-content: flex-start; }
  .operations-analysis-sort-field { flex-basis: 100%; }
  .oa-preference-options.common-options,.oa-preference-options.period-options,.oa-preference-options.metric-options { grid-template-columns: 1fr; }
}
@media(hover:none),(pointer:coarse) { .oa-table-image img { cursor: default; } }
@media(prefers-reduced-motion:reduce) { .operations-analysis-loading i { animation-duration: 1.8s; }.oa-store-disclosure summary > i { transition: none; } }