:root {
  color-scheme: light;
  --ink: #20242a;
  --muted: #69717b;
  --line: #dfe3e7;
  --paper: #ffffff;
  --canvas: #eff1f2;
  --sidebar: #20242a;
  --red: #d92e4b;
  --red-dark: #b9233c;
  --green: #168463;
  --blue: #2f7cf6;
  --amber: #d98a20;
  --violet: #7b61ff;
  --shadow: 0 8px 24px rgba(32, 36, 42, 0.045);
  font-family: "Avenir Next", "PingFang SC", "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; }
body { margin: 0; overflow-x: clip; color: var(--ink); background: var(--canvas); }
button, input, textarea { font: inherit; }
button { color: inherit; }
a { color: var(--blue); text-decoration: none; }
.shell { min-height: 100vh; display: grid; grid-template-columns: 196px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 20px 12px; display: flex; flex-direction: column; border-right: 1px solid #343941; background: var(--sidebar); color: #f4f2ee; }
.brand { display: flex; gap: 10px; align-items: center; padding: 8px 10px 22px; color: #f4f2ee; text-decoration: none; }
.brand-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 8px 8px 8px 2px; background: var(--red); color: white; font-weight: 800; }
.brand strong { display: block; font-size: 17px; }
.brand small { display: block; margin-top: 1px; color: #9ba1a8; font-size: 8px; letter-spacing: .14em; }
.sidebar nav { display: grid; gap: 4px; }
.sidebar nav a { display: flex; gap: 10px; align-items: center; min-height: 40px; padding: 0 12px; border-radius: 5px; color: #c3c6ca; font-size: 13px; }
.sidebar nav a span { width: 18px; text-align: center; color: #949ba3; }
.sidebar nav a:hover, .sidebar nav a.active { background: #343941; color: #fff; }
.sidebar nav a.active span { color: var(--red); }
.sidebar-tools { position: relative; margin-top: auto; border-top: 1px solid #3a4047; }
.sidebar-tools summary { min-height: 44px; display: flex; align-items: center; gap: 10px; padding: 0 10px; color: #c3c6ca; cursor: pointer; list-style: none; font-size: 12px; }
.sidebar-tools summary::-webkit-details-marker { display: none; }
.sidebar-tools summary:hover, .sidebar-tools[open] summary { color: #fff; }
.tools-icon { width: 18px; text-align: center; color: #9ba1a8; font-size: 15px; }
.tools-chevron { margin-left: auto; color: #9ba1a8; transition: transform .16s ease; }
.sidebar-tools[open] .tools-chevron { transform: rotate(180deg); }
.sidebar-tool-links { display: grid; gap: 3px; padding: 0 0 8px 28px; }
.sidebar-tool-links a, .sidebar-tool-links button { min-height: 32px; display: flex; align-items: center; padding: 0 10px; border: 0; border-radius: 4px; background: transparent; color: #aeb4bb; text-align: left; text-decoration: none; cursor: pointer; font-size: 11px; }
.sidebar-tool-links a:hover, .sidebar-tool-links button:hover { background: #343941; color: #fff; }
.sidebar-note { margin-top: 12px; padding: 13px 10px; display: flex; align-items: center; gap: 9px; border-top: 1px solid #3a4047; }
.sidebar-note b, .sidebar-note small { display: block; }
.sidebar-note b { font-size: 12px; }
.sidebar-note small { color: #a7adb3; font-size: 9px; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(24, 163, 127, .1); }
.account-identity { min-width: 0; flex: 1; }
.account-identity b, .account-identity small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.logout-button { padding: 5px 7px; border: 1px solid #4c525a; border-radius: 4px; background: transparent; color: #c3c6ca; cursor: pointer; font-size: 10px; }
.logout-button:hover { border-color: #a7adb3; color: #fff; }
.auth-screen { position: relative; isolation: isolate; min-height: 100vh; width: 100%; display: grid; place-items: center; overflow: hidden; padding: 32px 18px; background: #050505; color: #fff; }
.auth-svg-filter { position: absolute; width: 0; height: 0; overflow: hidden; }
.auth-stage { position: absolute; z-index: -1; inset: 0; overflow: hidden; opacity: .58; filter: url("#auth-gooey"); pointer-events: none; }
.auth-blob { position: absolute; width: 220px; height: 220px; border-radius: 50%; background: linear-gradient(135deg, #e8e8e8, #777 70%, #292929); filter: blur(20px); box-shadow: inset -10px -10px 20px rgba(0,0,0,.5), 10px 10px 30px rgba(255,255,255,.2); animation: auth-blob-float 22s infinite alternate ease-in-out; transition: margin .12s ease-out; }
.auth-blob:nth-child(1) { left: 7%; top: 12%; width: 220px; height: 220px; animation-duration: 22s; }
.auth-blob:nth-child(2) { left: 69%; top: 13%; width: 290px; height: 290px; animation-duration: 25s; animation-delay: -8s; }
.auth-blob:nth-child(3) { left: 77%; top: 68%; width: 170px; height: 170px; animation-duration: 21s; animation-delay: -4s; }
.auth-blob:nth-child(4) { left: 14%; top: 70%; width: 240px; height: 240px; animation-duration: 27s; animation-delay: -13s; }
.auth-blob:nth-child(5) { left: 47%; top: 4%; width: 130px; height: 130px; animation-duration: 23s; animation-delay: -6s; }
.auth-blob:nth-child(6) { left: 49%; top: 79%; width: 160px; height: 160px; animation-duration: 20s; animation-delay: -11s; }
@keyframes auth-blob-float { 0% { transform: translate(0,0) scale(1); } 33% { transform: translate(8vw,10vh) scale(1.16); } 66% { transform: translate(-5vw,6vh) scale(.84); } 100% { transform: translate(4vw,-8vh) scale(1.08); } }
.auth-container { position: relative; z-index: 1; width: min(440px, 100%); padding: 40px; }
.auth-header { display: block; margin-bottom: 48px; text-align: left; }
.auth-brand-id { display: block; margin-bottom: 12px; color: rgba(255,255,255,.52); font-family: "SFMono-Regular", Consolas, monospace; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; }
.auth-header h1 { margin: 0 0 14px -3px; color: #fff; font-size: clamp(42px, 10vw, 56px); font-weight: 800; line-height: .94; letter-spacing: -2px; }
.auth-subtitle { margin: 0; color: rgba(255,255,255,.66); font-size: 13px; line-height: 1.65; }
.auth-form { display: grid; gap: 0; }
.auth-field { position: relative; display: grid; gap: 0; margin: 0 0 27px; color: #fff; transition: transform .4s cubic-bezier(.2,1,.3,1); }
.auth-field:focus-within { transform: translateX(8px); }
.auth-field > span { display: flex; gap: 8px; align-items: baseline; margin-bottom: 7px; color: rgba(255,255,255,.55); font-family: "SFMono-Regular", Consolas, monospace; font-size: 11px; letter-spacing: .8px; text-transform: uppercase; }
.auth-field i { color: rgba(255,255,255,.38); font-size: 9px; font-style: normal; letter-spacing: 1px; }
.auth-form input { width: 100%; height: 43px; padding: 10px 0 12px; border: 0; border-bottom: 1px solid rgba(255,255,255,.15); border-radius: 0; outline: none; background: transparent; color: #fff; font-size: 16px; }
.auth-form input::placeholder { color: rgba(255,255,255,.34); }
.auth-form input:focus { border-bottom-color: rgba(255,255,255,.15); box-shadow: none; }
.auth-input-glow { position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: #dedede; box-shadow: 0 0 15px #dedede; transition: width .6s cubic-bezier(.2,1,.3,1); }
.auth-form input:focus + .auth-input-glow { width: 100%; }
.auth-hint { margin: -15px 0 18px; color: rgba(255,255,255,.5); font-size: 11px; }
.auth-error { margin: -11px 0 2px; color: #ff9da7; font-size: 12px; }
.auth-submit-wrap { position: relative; margin-top: 22px; filter: url("#auth-gooey"); }
.auth-submit-drop { position: absolute; inset: 0; border-radius: 50px; background: #c5c6c8; transition: all .5s cubic-bezier(.175,.885,.32,1.275); }
.auth-submit { position: relative; z-index: 1; width: 100%; min-height: 58px; padding: 16px 24px; border: 0; border-radius: 0; background: #f4f4f4; color: #080808; cursor: pointer; font-size: 12px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; transition: letter-spacing .3s; }
.auth-submit:hover { letter-spacing: 4px; }
.auth-submit-wrap:hover .auth-submit-drop { transform: scale(1.05,1.18); filter: brightness(1.16); }
.auth-submit:disabled { cursor: wait; opacity: .7; }
.auth-footer-nav { display: flex; justify-content: space-between; gap: 15px; margin-top: 34px; font-family: "SFMono-Regular", Consolas, monospace; font-size: 10px; }
.auth-footer-nav a { color: rgba(255,255,255,.52); text-decoration: none; transition: color .2s; }
.auth-footer-nav a:hover { color: #fff; }
.auth-footer { margin: 17px 0 0; color: rgba(255,255,255,.4); text-align: center; font-size: 10px; }
@media (max-width: 520px) { .auth-container { padding: 34px 26px; } .auth-header { margin-bottom: 40px; } .auth-footer-nav { flex-wrap: wrap; } .auth-blob:nth-child(2) { left: 52%; } }
main { width: min(1540px, 100%); min-width: 0; margin: 0 auto; padding: 30px 36px 56px; }
body[data-page="home"] #page-content > :not([data-page-view~="home"]),
body[data-page="selection"] #page-content > :not([data-page-view~="selection"]),
body[data-page="shop-detail"] #page-content > :not([data-page-view~="shop-detail"]),
body[data-page="shop-ranking"] #page-content > :not([data-page-view~="shop-ranking"]),
body[data-page="products"] #page-content > :not([data-page-view~="products"]),
body[data-page="shops"] #page-content > :not([data-page-view~="shops"]),
body[data-page="analytics"] #page-content > :not([data-page-view~="analytics"]),
body[data-page="alerts"] #page-content > :not([data-page-view~="alerts"]),
body[data-page="detail"] #page-content > :not([data-page-view~="detail"]),
body[data-page="tools-logs"] #page-content > :not([data-page-view~="tools-logs"]),
body[data-page="tools-data"] #page-content > :not([data-page-view~="tools-data"]),
body[data-page="tools-integrations"] #page-content > :not([data-page-view~="tools-integrations"]) { display: none !important; }
body[data-page="help"] #page-content > :not([data-page-view~="help"]) { display: none !important; }
body[data-page="alerts"] #stats, body[data-page="tools-logs"] #logs,
body[data-page="tools-data"] #data, body[data-page="tools-integrations"] #mcp { margin-top: 0; }
.sidebar-tool-links a.active { color: #fff; background: #343941; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); gap: 14px; margin: 0 0 18px; }
.dashboard-card { min-width: 0; padding: 18px; }
.home-recent-list { display: grid; }
.home-recent-item { display: flex; align-items: center; gap: 12px; min-height: 62px; border-top: 1px solid var(--line); color: var(--ink); }
.home-recent-cover { width: 40px; height: 40px; flex: 0 0 40px; display: grid; place-items: center; overflow: hidden; border-radius: 4px; background: #f4eeee; color: var(--red); font-weight: 700; }
.home-recent-cover img { width: 100%; height: 100%; object-fit: cover; }
.home-recent-copy { min-width: 0; flex: 1; display: grid; gap: 4px; }
.home-recent-copy b, .home-alert-item b { overflow: hidden; color: var(--ink); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.home-recent-copy small, .home-alert-item small { color: var(--muted); font-size: 11px; }
.home-recent-item > strong { font-size: 13px; }
.home-alert-item { display: flex; gap: 10px; align-items: center; min-height: 52px; border-top: 1px solid var(--line); color: var(--ink); }
.home-alert-item > span:last-child { min-width: 0; display: grid; gap: 4px; }
.text-link { color: var(--muted); font-size: 11px; }
header { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 18px; }
.eyebrow { margin: 0 0 6px; color: #7e303e; font-size: 10px; font-weight: 700; letter-spacing: .03em; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 6px; font-size: 29px; line-height: 1.15; letter-spacing: -.035em; }
h2 { margin-bottom: 0; font-size: 18px; line-height: 1.25; }
.subtitle { margin-bottom: 0; color: var(--muted); font-size: 13px; }
.header-actions, .form-actions { display: flex; gap: 9px; flex-wrap: wrap; }
.button { min-height: 38px; padding: 0 15px; border: 1px solid var(--line); border-radius: 5px; background: white; cursor: pointer; font-size: 13px; font-weight: 650; }
.button:hover { border-color: #ccd2de; }
.button.primary { border-color: var(--red); background: var(--red); color: white; box-shadow: 0 7px 18px rgba(247, 47, 85, .17); }
.button.primary:hover { background: var(--red-dark); }
.button.ghost { background: white; }
.metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; margin-bottom: 18px; padding: 8px 0; border: 1px solid #d6dade; border-radius: 5px; background: #fff; }
.metrics article { min-height: 70px; padding: 12px 17px; display: flex; align-items: center; gap: 11px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: transparent; }
.metrics article:last-child { border-right: 0; }
.metric-icon { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 8px; font-weight: 800; }
.metric-icon { display: none; }
.metric-icon.coral, .metric-icon.red { color: var(--red); background: #fff0f3; }
.metric-icon.violet { color: var(--violet); background: #f1efff; }
.metric-icon.teal { color: var(--green); background: #eaf8f4; }
.metric-icon.blue { color: var(--blue); background: #edf4ff; }
.metric-icon.amber { color: var(--amber); background: #fff7e9; }
.metrics small { display: block; color: var(--muted); font-size: 11px; }
.metrics strong { display: inline-block; margin-top: 4px; font-size: 22px; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
.metrics #metric-sales { color: var(--red); font-size: 25px; }
.metrics #metric-today, .metrics #metric-hour { color: var(--green); }
.metrics em { margin-left: 4px; color: var(--muted); font-size: 10px; font-style: normal; }
.panel { border: 1px solid var(--line); border-radius: 5px; background: var(--paper); box-shadow: var(--shadow); }
.table-panel { overflow: hidden; }
.report-panel { margin-bottom: 14px; overflow: hidden; }
.report-head { align-items: flex-start; }
.report-head small { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; }
.report-head small.connected { color: var(--green); }
.report-head small.fallback { color: var(--amber); }
.report-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.report-export-menu { position: relative; }
.report-export-menu summary { display: flex; align-items: center; gap: 9px; list-style: none; cursor: pointer; }
.report-export-menu summary::-webkit-details-marker { display: none; }
.report-export-menu[open] summary > span { transform: rotate(180deg); }
.report-export-options { position: absolute; z-index: 5; top: calc(100% + 5px); right: 0; min-width: 144px; padding: 5px; border: 1px solid var(--line); border-radius: 5px; background: white; box-shadow: var(--shadow); }
.report-export-options button { width: 100%; min-height: 34px; padding: 0 9px; border: 0; border-radius: 3px; background: white; color: var(--ink); text-align: left; cursor: pointer; font-size: 12px; }
.report-export-options button:hover { background: #f5f6f7; }
.report-head h1 { margin: 0; font-size: 24px; }
.report-toolbar { padding: 0 18px 12px; display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.report-toolbar .segmented { flex: 0 0 auto; }
.date-field { width: 142px; margin: 0; color: var(--muted); font-size: 10px; font-weight: 600; }
.date-field input { height: 34px; margin-top: 4px; padding-inline: 8px; font-size: 12px; }
.report-legend { margin: 0; padding: 0 18px 12px; color: var(--muted); font-size: 11px; }
.analysis-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 0 18px 16px; }
.analysis-summary article { min-width: 0; min-height: 88px; padding: 13px 15px; display: grid; align-content: center; gap: 5px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.analysis-summary small, .analysis-summary article > span { color: var(--muted); font-size: 10px; }
.analysis-summary strong { overflow: hidden; color: var(--ink); font-size: 23px; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
#analysis-total { color: var(--green); }
#analysis-leader { font-size: 16px; }
.analysis-charts { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr); gap: 12px; padding: 0 18px 16px; }
.analysis-chart-card { min-width: 0; min-height: 280px; padding: 0 14px 12px; }
.analysis-chart-card .panel-head { padding: 15px 2px 4px; }
.analysis-chart-card .panel-head small { color: var(--muted); font-size: 10px; }
.trend-chart { width: 100%; min-height: 218px; }
.trend-chart-svg { display: block; width: 100%; height: 218px; overflow: visible; }
.trend-grid { stroke: #e9ecef; stroke-width: 1; }
.trend-y-label, .trend-x-label { fill: #858d97; font-size: 10px; }
.trend-area { fill: rgba(217,46,75,.09); }
.trend-line { fill: none; stroke: var(--red); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.trend-point { fill: #fff; stroke: var(--red); stroke-width: 2; }
.trend-point.missing { fill: #f1f2f3; stroke: #aeb4bb; }
.analysis-empty { min-height: 180px; display: grid; place-items: center; color: var(--muted); font-size: 12px; }
.product-ranking { display: grid; }
.ranking-row { display: flex; align-items: center; gap: 9px; min-height: 29px; color: var(--ink); font-size: 11px; }
.ranking-index { width: 16px; color: #9aa1aa; font-size: 10px; text-align: center; }
.ranking-row:nth-child(-n+3) .ranking-index { color: var(--red); font-weight: 800; }
.ranking-product { min-width: 0; flex: 1; display: grid; gap: 3px; }
.ranking-label { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ranking-product i { display: block; height: 3px; overflow: hidden; border-radius: 2px; background: #f0f1f2; }
.ranking-product i b { display: block; height: 100%; border-radius: inherit; background: var(--red); }
.ranking-product i b.negative { background: var(--amber); }
.ranking-row > strong { min-width: 44px; text-align: right; font-variant-numeric: tabular-nums; }
.analysis-detail { overflow: hidden; }
.analysis-table-head { align-items: center; }
.analysis-table-head .segmented { flex: 0 0 auto; }
.analysis-detail .report-legend { padding-top: 0; }
.report-table-wrap { border-top: 1px solid var(--line); overflow-x: auto; }
.daily-report-table { min-width: max-content; }
.daily-report-table th, .daily-report-table td { min-width: 76px; padding: 10px 11px; text-align: center; white-space: nowrap; }
.daily-report-table th:first-child, .daily-report-table td:first-child { min-width: 220px; text-align: left; position: sticky; left: 0; z-index: 1; background: var(--paper); }
.daily-report-table th:nth-child(2), .daily-report-table td:nth-child(2) { min-width: 130px; position: sticky; left: 220px; z-index: 1; background: var(--paper); }
.daily-report-table thead th { position: sticky; top: 0; z-index: 2; }
.daily-report-table thead th:first-child, .daily-report-table thead th:nth-child(2) { z-index: 3; background: #fbfcfe; }
.report-date { display: block; color: var(--ink); font-size: 11px; }
.report-subhead { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; font-weight: 600; }
.report-product { display: block; overflow: hidden; text-overflow: ellipsis; max-width: 210px; }
.report-cell.missing { color: var(--amber); background: #fffaf1; }
.report-cell .missing-mark { margin-left: 3px; font-size: 10px; }
.report-cell.negative { color: var(--red); font-weight: 800; }
.report-cell.positive { color: var(--green); font-weight: 800; }
.toolbar { padding: 13px 16px; display: flex; gap: 10px; align-items: center; border-bottom: 1px solid var(--line); background: #f7f8f8; }
.toolbar > .button { flex: 0 0 auto; white-space: nowrap; }
.shop-filters { padding: 10px 16px; display: flex; flex-wrap: wrap; gap: 7px; overflow-x: hidden; border-bottom: 1px solid var(--line); background: #fff; }
.shop-filter { min-height: 30px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto; border: 1px solid #e4e6ea; border-radius: 5px; background: #fff; color: #626a75; cursor: pointer; font-size: 12px; white-space: nowrap; }
.shop-filter span { color: #9299a2; font-size: 10px; font-variant-numeric: tabular-nums; }
.shop-filter:hover { border-color: #d7a3ad; color: var(--red); }
.shop-filter.selected { border-color: #e9b7c0; background: #fff4f6; color: var(--red-dark); font-weight: 700; }
.shop-filter.selected span { color: var(--red-dark); }
.catalog-filters { padding: 9px 16px; display: flex; align-items: center; gap: 9px; border-bottom: 1px solid var(--line); background: #fff; }
.catalog-filters label { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; }
.catalog-filters select { min-width: 128px; height: 32px; padding: 0 27px 0 9px; border: 1px solid #e4e6ea; border-radius: 6px; background: #fff; color: var(--ink); font-size: 12px; }
.compact-button { min-height: 32px; padding: 0 10px; font-size: 11px; }
.field-hint { margin-top: 5px; color: var(--muted); font-size: 10px; font-weight: 400; }
.category-create-row { display: flex; gap: 8px; align-items: center; }
.category-create-row input { flex: 1; min-width: 0; }
.category-list { display: grid; gap: 7px; margin-top: 14px; }
.category-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 7px; font-size: 12px; }
.category-row button { padding: 4px 8px; border: 0; border-radius: 5px; background: #fff1f3; color: var(--red-dark); cursor: pointer; font-size: 11px; }
.product-taxonomy { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.taxonomy-pill { display: inline-flex; align-items: center; max-width: 130px; padding: 2px 7px; overflow: hidden; border: 1px solid #f0dfe3; border-radius: 999px; background: #fff6f7; color: #a64255; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.taxonomy-pill.tag { border-color: #e5e9ef; background: #f7f8fa; color: #697383; }
.shop-management-panel { padding-bottom: 18px; }
.shop-management-hint { margin: -8px 18px 14px; color: var(--muted); font-size: 11px; }
.shop-management-table { min-width: 850px; }
.shop-management-table thead th { text-align: center; }
.shop-management-table thead th:first-child, .shop-management-table tbody td:first-child { text-align: left; }
.shop-management-table tbody td { text-align: center; }
.shop-name-cell { display: grid; gap: 5px; }
.shop-name-cell b { font-size: 13px; }
.shop-name-cell small { color: var(--muted); font-size: 10px; white-space: nowrap; }
.search-box { width: min(360px, 100%); height: 38px; margin: 0; padding: 0 12px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 7px; background: white; color: var(--muted); font-size: 12px; font-weight: 500; }
.search-box input { height: 34px; padding: 0; border: 0; outline: 0; }
.segmented { padding: 3px; display: flex; gap: 2px; border: 1px solid var(--line); border-radius: 7px; background: #f1f4f8; }
.segmented button { min-height: 30px; padding: 0 10px; border: 0; border-radius: 5px; background: transparent; color: var(--muted); cursor: pointer; font-size: 12px; white-space: nowrap; }
.segmented button.selected { background: white; color: var(--ink); box-shadow: 0 1px 5px rgba(32, 35, 45, .08); }
.table-meta { padding: 12px 16px 10px; display: flex; justify-content: space-between; color: var(--muted); font-size: 12px; }
.table-meta b { color: var(--ink); font-size: 13px; }
.sort-control { position: relative; z-index: 1; display: inline-flex; align-items: center; color: var(--muted); font-size: 12px; }
.sort-control.open { z-index: 10001; }
.sort-trigger { min-height: 34px; padding: 0 10px 0 12px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid #e4e4e7; border-radius: 7px; background: #fff; color: #71717a; font: inherit; cursor: pointer; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; }
.sort-trigger:hover, .sort-control.open .sort-trigger { border-color: #d5d5db; background: #fff; box-shadow: 0 2px 8px #18181b0d; }
.sort-trigger b { color: #27272a; font-size: 12px; font-weight: 600; }
.sort-trigger svg { width: 15px; height: 15px; fill: none; stroke: #8b8b94; stroke-width: 1.7; transition: transform .16s ease; }
.sort-control.open .sort-trigger svg { transform: rotate(180deg); }
.sort-backdrop { position: fixed; inset: 0; z-index: 10000; background: transparent; }
.sort-popover { position: absolute; top: calc(100% + 8px); right: 0; z-index: 10002; width: 260px; padding: 8px; border: 1px solid #e4e4e7; border-radius: 12px; background: #fffffff2; box-shadow: 0 12px 34px #18181b1c, 0 2px 6px #18181b0a; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); transform-origin: top right; animation: sort-pop-in .16s ease-out; }
.sort-popover.hidden { display: none; }
.sort-option { width: 100%; min-height: 38px; padding: 0 9px; display: flex; align-items: center; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #52525b; text-align: left; font-size: 12px; cursor: pointer; transition: background .14s ease, border-color .14s ease, color .14s ease; }
.sort-option:hover { background: #f7f7f8; }
.sort-option.selected { border-color: #f4d7dd; background: #fff5f6; color: #bd2541; font-weight: 600; }
@keyframes sort-pop-in { from { opacity: 0; transform: translateY(-4px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
.table-wrap { width: 100%; overflow-x: auto; scrollbar-color: #c6cbd0 transparent; }
table { width: 100%; min-width: 980px; border-collapse: collapse; }
#products table { min-width: 1460px; table-layout: fixed; }
#products th:nth-child(1), #products td:nth-child(1) { width: 54px; }
#products th:nth-child(2), #products td:nth-child(2) { width: 58px; }
#products th:nth-child(3), #products td:nth-child(3) { width: 350px; }
#products th:nth-child(4), #products td:nth-child(4) { width: 150px; }
#products th:nth-child(5), #products td:nth-child(5) { width: 76px; }
#products th:nth-child(6), #products td:nth-child(6), #products th:nth-child(7), #products td:nth-child(7) { width: 88px; }
#products th:nth-child(8), #products td:nth-child(8) { width: 78px; }
#products th:nth-child(9), #products td:nth-child(9) { width: 154px; }
#products th:nth-child(10), #products td:nth-child(10) { width: 168px; }
#products th:nth-child(11), #products td:nth-child(11) { width: 212px; }
#products td:nth-child(n+4):nth-child(-n+10) { white-space: nowrap; }
th, td { padding: 13px 14px; border-bottom: 1px solid #eef1f5; text-align: left; vertical-align: middle; font-size: 13px; }
th { color: #8b92a0; font-size: 11px; font-weight: 700; background: #fbfcfe; }
td small { display: block; margin-top: 4px; color: #818891; font-size: 10px; }
.rank { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #eef2f6; color: #8790a0; font-weight: 800; }
.rank.hot { background: #f6e9dc; color: #8e5128; }
.product-cell { min-width: 0; display: flex; gap: 10px; align-items: center; }
.product-badge { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 5px; background: #f3e8e9; color: #983e4c; font-weight: 750; }
.product-thumb { width: 42px; height: 42px; flex: 0 0 auto; position: relative; display: grid; place-items: center; overflow: hidden; border-radius: 6px; background: color-mix(in srgb, var(--accent) 12%, white); color: var(--accent); font-size: 15px; font-weight: 750; }
.product-thumb::before { content: attr(data-label); }
.product-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.product-image-preview { display: flex; align-items: center; gap: 10px; padding: 9px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font-size: 12px; }
.product-image-preview[hidden] { display: none; }
.product-image-preview img { width: 52px; height: 52px; object-fit: cover; border-radius: 4px; }
.product-cell > div { min-width: 0; }
.product-cell b { max-width: 100%; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-name-link { max-width: 100%; overflow: hidden; padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; text-align: left; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.product-name-link:hover { color: var(--red-dark); text-decoration: underline; text-underline-offset: 3px; }
.product-detail-view .shell > main > :not(#product-detail) { display: none; }
.product-detail-page { display: grid; gap: 16px; }
.product-detail-page[hidden], .product-detail-page.hidden { display: none; }
.detail-back { width: fit-content; padding: 5px 0; border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 13px; }
.detail-back:hover { color: var(--red-dark); }
.detail-hero { display: flex; align-items: center; gap: 24px; padding: 24px; }
.detail-cover { width: 132px; height: 132px; flex: 0 0 auto; position: relative; display: grid; place-items: center; overflow: hidden; border-radius: 9px; background: #f5e8ea; color: var(--red-dark); font-size: 42px; font-weight: 750; }
.detail-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.detail-cover.has-image > span { visibility: hidden; }
.detail-identity { min-width: 0; }
.detail-identity h1 { overflow-wrap: anywhere; }
.detail-identity > p:not(.eyebrow) { color: var(--muted); font-size: 13px; }
.shop-metrics-line { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; font-weight: 400; line-height: 1.5; }
.detail-actions { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 14px; }
.detail-images-panel { padding: 18px; }
.image-download-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.detail-images-message { margin: 0; color: var(--muted); font-size: 12px; }
.detail-images-message.error { color: var(--red-dark); }
.image-download-progress { margin-top: 12px; }
.detail-image-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.detail-image-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.detail-image-card > img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: contain; background: #f6f6f6; }
.detail-image-card > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px; color: var(--muted); font-size: 11px; }
.detail-image-card .button { min-height: 30px; padding: 5px 9px; font-size: 11px; }
.detail-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.detail-metrics article { min-width: 0; display: grid; gap: 9px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.detail-metrics small, .detail-caption { color: var(--muted); font-size: 11px; }
.detail-metrics strong { font-size: 22px; }
.detail-chart-panel, .detail-history { overflow: hidden; }
.detail-chart { width: 100%; height: 190px; padding: 0 16px; overflow: visible; }
.detail-chart line { stroke: #e9edf1; stroke-width: 1; }
.detail-chart polyline { fill: none; stroke: var(--red); stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; }
.detail-chart circle { fill: var(--red); }
.detail-chart-ends { display: flex; justify-content: space-between; padding: 0 20px 16px; color: var(--muted); font-size: 10px; }
.detail-empty { padding: 28px 18px; color: var(--muted); text-align: center; font-size: 12px; }
.detail-history table { min-width: 0; }
.detail-history th:first-child, .detail-history td:first-child { width: 220px; }
.price { color: var(--red); font-weight: 800; }
.positive { color: var(--green); font-weight: 800; }
.negative { color: var(--red); font-weight: 800; }
.muted { color: #b0b6c2; }
.switch { width: 38px; height: 22px; padding: 0; border: 0; border-radius: 999px; background: #c9ced8; cursor: pointer; position: relative; }
.switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: white; transition: .16s; box-shadow: 0 1px 3px rgba(0,0,0,.18); }
.switch.on { background: var(--red); }
.switch.on::after { transform: translateX(16px); }
.row-actions { display: flex; gap: 6px; }
.row-actions button, .icon-button, .close { border: 0; background: transparent; cursor: pointer; }
.row-actions button { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 6px; background: #f5f7fa; color: #697180; }
.row-actions button[data-edit] { width: auto; min-width: 40px; padding: 0 9px; font-size: 12px; font-weight: 650; }
.row-actions button[data-download-product] { width: auto; min-width: 72px; padding: 0 9px; background: #fff1f4; color: var(--red-dark); font-size: 11px; font-weight: 650; white-space: nowrap; }
.row-actions button:hover { background: #fff1f4; color: var(--red); }
.lower-grid { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.data-grid { grid-template-columns: .95fr 1.05fr; }
.panel-head { display: flex; justify-content: space-between; align-items: center; padding: 18px 18px 12px; }
.panel-head.compact { padding-bottom: 10px; }
.icon-button { width: 32px; height: 32px; border-radius: 7px; background: #f5f7fa; }
.alert-list, .log-list { padding: 0 18px 18px; display: grid; gap: 8px; }
.alert-item, .log-row { padding: 11px; display: grid; grid-template-columns: 30px 1fr auto; gap: 10px; align-items: center; border-radius: 7px; background: #f8fafc; }
.alert-symbol { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: #fff1f4; color: var(--red); font-weight: 800; }
.alert-item b, .alert-item small, .log-row b, .log-row small { display: block; }
.alert-item b, .log-row b { font-size: 12px; }
.alert-item small, .alert-time, .log-row small, .log-row time { color: var(--muted); font-size: 10px; }
.log-status { width: 9px; height: 9px; margin-left: 10px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(24, 163, 127, .1); }
.log-status.error { background: var(--red); box-shadow: 0 0 0 4px rgba(247, 47, 85, .1); }
.no-alerts { padding: 28px; color: var(--muted); text-align: center; font-size: 12px; }
.shop-notifications-section { padding: 0 18px 12px; }
.shop-notifications-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 8px 0; }
.shop-notifications-heading h3, .alerts-subheading { margin: 0; font-size: 13px; }
.shop-notifications-heading > span { color: var(--red-dark); font-size: 11px; }
.shop-notification-list { display: grid; }
.shop-notification-item { display: flex; align-items: center; gap: 10px; padding: 11px 4px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.shop-notification-item:hover { background: #fafafa; }
.shop-notification-item.read { color: var(--muted); }
.shop-notification-mark { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: transparent; }
.shop-notification-item.unread .shop-notification-mark { background: var(--red); }
.shop-notification-copy { display: grid; min-width: 0; gap: 3px; flex: 1; }
.shop-notification-copy b, .shop-notification-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shop-notification-copy b { font-size: 12px; }
.shop-notification-copy small, .shop-notification-item time { color: var(--muted); font-size: 11px; }
.shop-notifications-section > button { margin-top: 10px; }
.alerts-subheading { margin: 16px 18px 0; }
.shop-notification-context { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 18px 14px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 7px; background: #fafafa; color: var(--muted); font-size: 12px; }
.shop-notification-context.hidden { display: none; }
.workflow-list { display: grid; padding: 0 18px 18px; }
.workflow-list button { padding: 12px 0; display: grid; grid-template-columns: 32px 1fr auto; gap: 10px; align-items: center; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: left; cursor: pointer; }
.workflow-icon { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 7px; background: #f1f4f8; }
.workflow-list b, .workflow-list small { display: block; }
.workflow-list b { font-size: 12px; }
.workflow-list small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.workflow-list i { color: var(--muted); font-style: normal; }
.mcp-box { margin: 0 18px 18px; padding: 14px; border: 1px solid var(--line); border-radius: 7px; background: #fbfcfe; }
.mcp-box code { display: inline-block; margin-bottom: 10px; padding: 5px 7px; border-radius: 5px; background: #eef2f6; color: #394152; font-size: 12px; }
.mcp-box p { margin-bottom: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.empty { padding: 42px 20px; text-align: center; }
.empty > span { width: 44px; height: 44px; margin: 0 auto 13px; display: grid; place-items: center; border-radius: 50%; background: #fff0f3; color: var(--red); font-size: 22px; }
.empty h3 { margin-bottom: 6px; }
.empty p { color: var(--muted); font-size: 12px; }
.hidden { display: none !important; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
dialog { width: min(560px, calc(100vw - 28px)); padding: 0; border: 0; border-radius: 8px; background: var(--paper); box-shadow: 0 30px 90px rgba(27,22,31,.25); }
dialog::backdrop { background: rgba(24, 28, 38, .48); backdrop-filter: blur(3px); }
dialog form { padding: 24px; }
.modal-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 18px; }
.modal-head small { color: var(--muted); }
.close { width: 30px; height: 30px; border-radius: 6px; color: var(--muted); font-size: 22px; }
.close:hover { background: #f3f5f8; }
label { display: grid; gap: 7px; margin-bottom: 14px; font-size: 12px; font-weight: 700; }
input, textarea { width: 100%; padding: 0 12px; border: 1px solid #dce1e8; border-radius: 7px; outline: none; background: white; font-size: 13px; }
input { height: 40px; }
textarea { min-height: 132px; padding-top: 10px; resize: vertical; }
input:focus, textarea:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(247,47,85,.09); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.settings-divider { margin: 22px 0 14px; padding-top: 18px; border-top: 1px solid var(--line); }
.settings-divider h3 { margin: 3px 0 7px; font-size: 15px; }
.field-help { margin: -4px 0 14px; color: var(--muted); font-size: 11px; line-height: 1.65; }
.field-help code { padding: 2px 4px; border-radius: 4px; background: #eef2f6; color: #394152; }
.bulk-import-content { padding: 24px; }
.bulk-import-instructions { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
#bulk-import-modal { width: min(680px, calc(100vw - 28px)); }
#bulk-import-progress { width: 100%; height: 8px; margin: 4px 0 16px; accent-color: var(--red); }
.bulk-import-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.bulk-import-summary article { padding: 12px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.bulk-import-summary span, .bulk-import-summary strong { display: block; }
.bulk-import-summary span { color: var(--muted); font-size: 11px; }
.bulk-import-summary strong { margin-top: 5px; font-size: 21px; }
.bulk-import-failures, .bulk-import-warnings { max-height: 220px; overflow: auto; margin: 10px 0 14px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 11px; line-height: 1.65; }
.bulk-import-failures h3, .bulk-import-warnings h3 { margin: 0 0 6px; font-size: 12px; }
.bulk-import-failures p, .bulk-import-warnings p { margin: 4px 0; overflow-wrap: anywhere; }
.bulk-import-failures { border-color: #f2c7cf; }
.bulk-import-warnings { border-color: #f2dfb5; }
@media (max-width: 520px) { .bulk-import-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.collect-row { margin: -3px 0 14px; display: flex; align-items: center; gap: 10px; }
.collect-row .button { flex: 0 0 auto; }
#collect-status { color: var(--muted); font-size: 11px; line-height: 1.5; }
#collect-status.loading { color: var(--blue); }
#collect-status.success { color: var(--green); }
#collect-status.warning { color: var(--amber); }
.form-actions { justify-content: flex-end; margin-top: 20px; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 10; max-width: 360px; padding: 12px 16px; border-radius: 7px; background: #20232d; color: white; opacity: 0; transform: translateY(12px); pointer-events: none; transition: .2s; font-size: 12px; box-shadow: var(--shadow); }
.toast.show { opacity: 1; transform: translateY(0); }
.toast.error { background: #b93d41; }

button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(217, 46, 75, .4);
  outline-offset: 2px;
}
tbody tr:hover td { background: #f8f3f3; }
th, td { padding-top: 11px; padding-bottom: 11px; }
dialog { border-radius: 6px; }

@media (max-width: 1180px) {
  .metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .metrics article:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
  .metrics article:nth-child(3n) { border-right: 0; }
  .toolbar { flex-wrap: wrap; }
  .search-box { width: 100%; }
  .selection-search-form { width: 100%; }
  .toolbar > .button { flex: 0 0 auto; white-space: nowrap; }
}

@media (max-width: 840px) {
  main { padding: 22px 16px 42px; }
  header { align-items: flex-start; flex-direction: column; }
  .header-actions { width: 100%; }
  .header-actions .button { flex: 1; min-width: 120px; }
  .metrics, .lower-grid, .data-grid { grid-template-columns: 1fr 1fr; }
  .analysis-charts { grid-template-columns: 1fr; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .metrics article { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .metrics article:nth-child(2n) { border-right: 0; }
  .metrics article:nth-child(n+5) { border-bottom: 0; }
}

@media (max-width: 620px) {
  .shell { display: block; }
  .sidebar { position: static; height: auto; flex-direction: column; align-items: stretch; gap: 8px; }
  .brand { justify-content: flex-start; padding: 0 4px 8px; }
  .brand > span:last-child { display: block; font-size: inherit; }
  .sidebar nav { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sidebar nav a { justify-content: flex-start; padding: 0 10px; font-size: 12px; }
  .sidebar nav a span { font-size: 15px; }
  .sidebar-tools { margin-top: 4px; }
  .sidebar-tools summary { justify-content: flex-start; padding: 0 10px; }
  .sidebar-tools summary > span:not(.tools-icon) { display: inline; }
  .tools-chevron { margin-left: auto; }
  .sidebar-tool-links { position: static; width: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 0 8px 28px; border: 0; box-shadow: none; }
  .sidebar-note { display: none; }
  .metrics, .lower-grid, .data-grid, .dashboard-grid, .form-row { grid-template-columns: 1fr; }
  .analysis-summary { grid-template-columns: 1fr; }
  .analysis-summary article { min-height: 72px; }
  .analysis-table-head { align-items: flex-start; flex-direction: column; }
  .analysis-table-head .segmented { width: 100%; }
  .analysis-table-head .segmented button { flex: 1; }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metrics article { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .metrics article:nth-child(2n) { border-right: 0; }
  .metrics article:nth-child(n+5) { border-bottom: 0; }
  .collect-row { align-items: stretch; flex-direction: column; }
  .collect-row .button { width: 100%; }
  .metrics article { min-height: 78px; }
  .detail-hero { align-items: flex-start; flex-direction: column; gap: 14px; padding: 18px; }
  .detail-cover { width: 96px; height: 96px; font-size: 32px; }
  .detail-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .detail-metrics article { padding: 12px; }
  .detail-metrics strong { font-size: 18px; }
  .detail-history th:first-child, .detail-history td:first-child { width: 155px; }
  .toolbar { align-items: stretch; flex-direction: column; }
  .segmented { overflow-x: auto; }
  .shop-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
  .catalog-filters { flex-wrap: wrap; }
  .catalog-filters label { flex: 1 1 42%; justify-content: space-between; }
  .catalog-filters select { min-width: 0; flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* App1-inspired neutral workspace shell and dashboard cards. */
:root { --ink: #18181b; --muted: #71717a; --line: #e4e4e7; --paper: #fff; --canvas: #f8f9fb; --sidebar: #fff; --shadow: 0 1px 2px rgba(0,0,0,.04); }
.shell { grid-template-columns: 232px minmax(0,1fr); background: var(--canvas); }
.shell { transition: grid-template-columns .2s ease; }
.shell.sidebar-collapsed { grid-template-columns: 84px minmax(0,1fr); }
.sidebar-collapsed .sidebar { padding-inline: 9px; }
.sidebar-collapsed .brand { justify-content: center; padding-inline: 0; }
.sidebar-collapsed .brand > span:last-child,
.sidebar-collapsed .sidebar-caption,
.sidebar-collapsed .sidebar-note .account-identity { display: none; }
.sidebar-collapsed .sidebar nav a { justify-content: center; padding-inline: 0; font-size: 0; }
.sidebar-collapsed .sidebar nav a span { font-size: 16px; }
.sidebar-collapsed .sidebar-tools summary { justify-content: center; padding-inline: 0; }
.sidebar-collapsed .sidebar-tools summary > span:not(.tools-icon) { display: none; }
.sidebar-collapsed .sidebar-tool-links { position: absolute; z-index: 15; bottom: 0; left: calc(100% + 8px); width: 190px; padding: 7px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.1); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 18px 14px 14px; border-right: 1px solid var(--line); background: #fff; color: var(--ink); }
.brand { margin-bottom: 16px; padding: 5px 7px 14px; color: var(--ink); }
.brand-mark { background: #18181b; }
.brand small { color: #a1a1aa; }
.sidebar-caption { margin: 2px 10px 9px; color: #a1a1aa; font-size: 10px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.sidebar nav { gap: 3px; }
.sidebar nav a { min-height: 37px; border-radius: 6px; color: #52525b; }
.sidebar nav a span { color: #71717a; }
.sidebar nav a .nav-icon, .sidebar-tools .nav-icon { width: 17px; height: 17px; display: block; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sidebar-tools .tools-icon { display: inline-flex; align-items: center; justify-content: center; }
.sidebar-tools .tools-chevron { display: inline-flex; align-items: center; justify-content: center; }
.sidebar-tools .tools-chevron .nav-icon { width: 14px; height: 14px; }
.sidebar nav a:hover, .sidebar nav a.active { background: #f4f4f5; color: #18181b; }
.sidebar nav a.active span { color: #18181b; }
.sidebar-tools { border-top-color: var(--line); }
.sidebar-tools summary { color: #52525b; }
.sidebar-tools summary:hover, .sidebar-tools[open] summary { color: #18181b; }
.tools-icon, .tools-chevron { color: #71717a; }
.sidebar-tool-links a, .sidebar-tool-links button { color: #52525b; }
.sidebar-tool-links a:hover, .sidebar-tool-links button:hover, .sidebar-tool-links a.active { background: #f4f4f5; color: #18181b; }
.sidebar-note { border-top-color: var(--line); }
.sidebar-note b { color: var(--ink); }
.sidebar-note small { color: var(--muted); }
.logout-button { border-color: var(--line); color: #52525b; }
.logout-button:hover { border-color: #a1a1aa; color: #18181b; }
.app-main { min-width: 0; min-height: 100vh; display: flex; flex-direction: column; }
.app-topbar { position: sticky; top: 0; z-index: 20; min-height: 66px; margin: 0; padding: 0 26px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 18px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.94); backdrop-filter: blur(12px); }
.app-topbar-heading { min-width: 0; display: flex; align-items: center; gap: 13px; }
.app-topbar-heading .eyebrow { margin: 0 0 3px; color: #71717a; font-size: 9px; font-weight: 550; letter-spacing: .08em; text-transform: uppercase; }
.app-topbar h1 { max-width: 54vw; margin: 0; overflow: hidden; color: #18181b; font-size: 15px; font-weight: 600; line-height: 1.35; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-trigger, .topbar-icon { width: 34px; height: 34px; flex: 0 0 auto; display: inline-grid; place-items: center; border: 0; border-radius: 6px; background: transparent; color: #52525b; cursor: pointer; text-decoration: none; }
.sidebar-trigger:hover, .topbar-icon:hover { background: #f4f4f5; color: #18181b; }
.sidebar-trigger { font-size: 17px; }
.app-topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 7px; }
.topbar-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.notification-link { position: relative; }
.notification-dot { display: none; position: absolute; top: 6px; right: 6px; width: 7px; height: 7px; border: 1.5px solid white; border-radius: 50%; background: #d92e4b; }
.notification-dot.visible { display: block; }
.topbar-avatar { width: 31px; height: 31px; margin: 0 5px 0 2px; display: grid; place-items: center; overflow: hidden; border: 1px solid #e4e4e7; border-radius: 50%; background: #f4f4f5; color: #3f3f46; font-size: 10px; font-weight: 650; }
.app-topbar .button.primary { min-height: 34px; border-color: #18181b; border-radius: 6px; background: #18181b; box-shadow: none; font-size: 12px; }
.app-topbar .button.primary:hover { border-color: #3f3f46; background: #3f3f46; }
.app-topbar .tutorial-launch { min-height: 34px; padding-inline: 10px; border-radius: 6px; font-size: 12px; }
.app-content { width: 100%; max-width: none; min-width: 0; flex: 1; margin: 0; padding: 0; }
#page-content { width: min(100%, 1540px); min-width: 0; margin: 0 auto; padding: 24px 28px 42px; }
body[data-page="home"] #page-content > :not([data-page-view~="home"]),
body[data-page="selection"] #page-content > :not([data-page-view~="selection"]),
body[data-page="shop-detail"] #page-content > :not([data-page-view~="shop-detail"]),
body[data-page="shop-ranking"] #page-content > :not([data-page-view~="shop-ranking"]),
body[data-page="products"] #page-content > :not([data-page-view~="products"]),
body[data-page="shops"] #page-content > :not([data-page-view~="shops"]),
body[data-page="analytics"] #page-content > :not([data-page-view~="analytics"]),
body[data-page="alerts"] #page-content > :not([data-page-view~="alerts"]),
body[data-page="detail"] #page-content > :not([data-page-view~="detail"]),
body[data-page="tools-logs"] #page-content > :not([data-page-view~="tools-logs"]),
body[data-page="tools-data"] #page-content > :not([data-page-view~="tools-data"]),
body[data-page="tools-integrations"] #page-content > :not([data-page-view~="tools-integrations"]) { display: none !important; }
body[data-page="help"] #page-content > :not([data-page-view~="help"]) { display: none !important; }
.panel { border-color: var(--line); border-radius: 9px; background: #fff; box-shadow: var(--shadow); }
.metrics { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; margin: 0 0 18px; padding: 0; border: 0; border-radius: 0; background: transparent; }
.metrics article { min-width: 0; min-height: 126px; padding: 17px 18px 15px; display: flex; flex-direction: column; align-items: stretch; justify-content: space-between; gap: 9px; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: var(--shadow); }
.metric-card-head { display: flex; justify-content: space-between; align-items: center; gap: 9px; }
.metric-card-head small { color: #52525b; font-size: 12px; font-weight: 550; }
.metric-glyph { color: #a1a1aa; font-size: 17px; }
.metrics strong, .metrics #metric-sales, .metrics #metric-today { margin: 0; color: #18181b; font-size: 26px; font-weight: 650; letter-spacing: -.035em; }
.metrics #metric-today { color: #168463; }
.metrics em { color: #71717a; font-size: 10px; }
.metric-hint, .metric-link { min-height: 14px; color: #71717a; font-size: 10px; }
.metric-link { width: fit-content; text-decoration: none; }
.metric-link:hover, .text-link:hover { color: #18181b; }
.home-trend-card { margin-bottom: 18px; padding: 0 20px 10px; overflow: hidden; }
.home-panel-head { min-height: 68px; padding: 16px 20px 10px; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.home-panel-head h2 { margin: 0; font-size: 14px; font-weight: 600; letter-spacing: -.01em; }
.home-panel-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.coverage-chip { padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; color: #71717a; font-size: 10px; white-space: nowrap; }
.home-sales-chart { min-width: 0; padding: 0 4px; }
.home-chart-svg { display: block; width: 100%; height: 260px; overflow: visible; }
.home-chart-grid { stroke: #ececf0; stroke-width: 1; stroke-dasharray: 3 4; }
.home-chart-y-label, .home-chart-x-label { fill: #71717a; font-size: 10px; }
.home-chart-previous { fill: none; stroke: #8b8b94; stroke-width: 2; stroke-dasharray: 5 5; stroke-linecap: round; stroke-linejoin: round; }
.home-chart-recent { fill: none; stroke: #18181b; stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; }
.home-chart-area { fill: url("#home-chart-fill"); opacity: .8; }
.home-chart-previous-point { fill: #fff; stroke: #8b8b94; stroke-width: 2; }
.home-chart-recent-point { fill: #18181b; stroke: #fff; stroke-width: 1.5; }
.home-chart-legend { min-height: 29px; display: flex; justify-content: center; align-items: center; gap: 20px; color: #52525b; font-size: 10px; }
.home-chart-legend span { display: inline-flex; align-items: center; gap: 7px; }
.home-chart-legend i { width: 18px; height: 2px; background: #18181b; }
.home-chart-legend i.previous { background: repeating-linear-gradient(90deg,#8b8b94 0 5px,transparent 5px 8px); }
.home-chart-empty { min-height: 226px; display: grid; place-items: center; color: #71717a; font-size: 12px; }
.dashboard-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 0; }
.dashboard-card { min-width: 0; padding: 0 0 8px; overflow: hidden; }
.dashboard-card .home-panel-head { min-height: 70px; padding-inline: 18px; }
.dashboard-card .text-link { flex: 0 0 auto; }
.home-recent-list { display: grid; padding: 0 18px 8px; }
.home-rank-item { min-width: 0; display: flex; align-items: center; gap: 9px; padding: 12px 0; border-top: 1px solid #f0f0f2; color: var(--ink); text-decoration: none; }
.home-rank-index { width: 15px; flex: 0 0 15px; color: #a1a1aa; font-size: 10px; text-align: center; }
.home-rank-item .product-thumb { width: 36px; height: 36px; border-radius: 7px; }
.home-rank-body { min-width: 0; flex: 1; display: grid; gap: 5px; }
.home-rank-heading { min-width: 0; display: flex; justify-content: space-between; align-items: center; gap: 9px; }
.home-rank-heading b { min-width: 0; overflow: hidden; font-size: 11px; font-weight: 550; text-overflow: ellipsis; white-space: nowrap; }
.home-rank-heading strong { flex: 0 0 auto; font-size: 11px; font-variant-numeric: tabular-nums; }
.home-rank-body > small { overflow: hidden; color: #71717a; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.home-rank-track { height: 4px; overflow: hidden; border-radius: 99px; background: #f0f0f2; }
.home-rank-track i { display: block; height: 100%; border-radius: inherit; background: #27272a; }
.home-activity-list { display: grid; padding: 0 18px 8px; }
.home-activity-item { min-height: 61px; display: flex; align-items: flex-start; gap: 11px; padding: 13px 0; border-top: 1px solid #f0f0f2; }
.home-activity-mark { width: 8px; height: 8px; flex: 0 0 auto; margin: 5px 0 0 2px; border-radius: 50%; background: #a1a1aa; box-shadow: 0 0 0 4px #f4f4f5; }
.home-activity-mark.success { background: #22a06b; box-shadow: 0 0 0 4px #eaf7f0; }
.home-activity-mark.error, .home-activity-mark.failed { background: #d92e4b; box-shadow: 0 0 0 4px #fff0f3; }
.home-activity-copy { min-width: 0; flex: 1; }
.home-activity-copy > div { display: flex; justify-content: space-between; gap: 10px; }
.home-activity-copy b { color: #3f3f46; font-size: 10px; font-weight: 600; }
.home-activity-copy time { flex: 0 0 auto; color: #a1a1aa; font-size: 9px; }
.home-activity-copy p { margin: 4px 0 0; overflow: hidden; color: #71717a; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.home-recent-list .no-alerts, .home-activity-list .no-alerts { margin: 0; padding: 26px 8px; color: #71717a; text-align: center; font-size: 11px; }

.sidebar-selection-library, .sidebar-my-selection { margin: 2px 0 0; }
.sidebar-selection-library summary, .sidebar-my-selection summary { min-height: 40px; display: flex; align-items: center; gap: 10px; padding: 0 12px; border-radius: 5px; color: #52525b; cursor: pointer; list-style: none; font-size: 13px; }
.sidebar-selection-library summary::-webkit-details-marker, .sidebar-my-selection summary::-webkit-details-marker { display: none; }
.sidebar-selection-library summary:hover, .sidebar-selection-library[open] summary, .sidebar-my-selection summary:hover, .sidebar-my-selection[open] summary { background: #f4f4f5; color: #18181b; }
.sidebar-group-icon { width: 18px; flex: 0 0 18px; display: grid; place-items: center; color: #71717a; }
.sidebar-group-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.my-selection-chevron, .sidebar-group-chevron { width: 18px; margin-left: auto; display: grid; place-items: center; color: #71717a; transition: transform .16s ease; }
.my-selection-chevron svg, .sidebar-group-chevron svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sidebar-my-selection[open] .my-selection-chevron { transform: rotate(180deg); }
.sidebar-selection-library[open] .sidebar-group-chevron { transform: rotate(180deg); }
.my-selection-links, .sidebar-group-links { display: grid; gap: 2px; margin: 0 0 5px 20px; padding-left: 9px; border-left: 1px solid var(--line); }
.sidebar nav .my-selection-links a, .sidebar nav .sidebar-group-links a { min-height: 34px; padding-inline: 12px; color: #71717a; font-size: 12px; }
.sidebar nav .my-selection-links a, .sidebar nav .sidebar-group-links a { display: flex; align-items: center; gap: 9px; }
.sidebar-subnav-icon { width: 14px; height: 14px; flex: 0 0 14px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sidebar nav .my-selection-links a:hover, .sidebar nav .my-selection-links a.active, .sidebar nav .sidebar-group-links a:hover, .sidebar nav .sidebar-group-links a.active { background: #f4f4f5; color: #18181b; }
.selection-page { display: grid; gap: 16px; }
.selection-page-head { padding: 18px; }
.selection-page-head h2 { margin: 2px 0 0; font-size: 18px; }
.selection-page-head > div > p:last-child { margin: 7px 0 0; color: var(--muted); font-size: 12px; }
.selection-toolbar { margin: 0; }
.selection-search-form { display: flex; flex: 1; gap: 8px; min-width: 0; }
.selection-search-form .search-box { width: auto; flex: 1; }
.selection-category-filters[hidden] { display: none; }
.selection-count { color: var(--muted); font-size: 12px; white-space: nowrap; }
.selection-category-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 16px; }
.selection-category-filter { border: 1px solid var(--line); border-radius: 999px; padding: 7px 14px; background: #fff; color: var(--muted); cursor: pointer; font-size: 12px; }
.selection-category-filter:hover, .selection-category-filter.selected { border-color: #18181b; background: #18181b; color: #fff; }
.selection-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.selection-card { min-width: 0; overflow: hidden; }
.selection-card-cover { position: relative; aspect-ratio: 1.42; display: grid; place-items: center; overflow: hidden; background: linear-gradient(145deg,#f5f5f6,#e7e7e9); color: #a1a1aa; }
.selection-card-cover > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.selection-card-cover > span { font-size: 48px; font-weight: 650; }
.selection-rank { position: absolute; top: 10px; left: 10px; padding: 5px 8px; border: 1px solid #ffffffab; border-radius: 5px; background: #18181bc9; color: #fff; font-size: 10px; }
.selection-rank.top-1 { background: #d92e4b; }
.selection-rank.top-2 { background: #e77d33; }
.selection-rank.top-3 { background: #b28a45; }
.selection-sales { position: absolute; right: 9px; bottom: 9px; padding: 6px 8px; border-radius: 5px; background: #18181bcc; color: #fff; font-size: 11px; }
.selection-card-body { display: grid; gap: 12px; padding: 13px; }
.selection-card-body h3 { min-height: 36px; margin: 0; overflow: hidden; color: var(--ink); font-size: 13px; line-height: 1.45; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.selection-card-meta { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 11px; }
.selection-card-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.selection-card-meta b { flex: 0 0 auto; color: var(--red); font-size: 14px; }
.selection-card-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; padding: 10px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.selection-card-stats span { display: grid; gap: 4px; color: var(--muted); font-size: 10px; }
.selection-card-stats strong { color: var(--ink); font-size: 13px; }
.selection-add-button { width: 100%; min-height: 35px; }
.selection-add-button:disabled, .selection-add-small:disabled { border-color: #e4e4e7; background: #f4f4f5; color: #71717a; cursor: default; }
.selection-thumb { position: relative; width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; overflow: hidden; border-radius: 7px; background: #f0f0f2; color: #71717a; }
.selection-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.selection-add-small { flex: 0 0 auto; min-height: 28px; padding: 0 8px; font-size: 10px; }
.selection-empty { grid-column: 1/-1; display: grid; min-height: 140px; place-items: center; color: var(--muted); font-size: 13px; }
.selection-toolbar .search-box { flex: 1; }
.shop-leaderboard-toolbar .search-box { flex: 1; }
.shop-leaderboard-table { min-width: 850px; }
.shop-leaderboard-table th, .shop-leaderboard-table td { text-align: center; }
.shop-leaderboard-table th:nth-child(2), .shop-leaderboard-table td:nth-child(2) { text-align: left; }
.shop-leaderboard-table td:first-child { color: var(--muted); font-variant-numeric: tabular-nums; }
.shop-detail-head { align-items: flex-start; }
.shop-detail-head > div > p:last-child { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
.shop-detail-back { display: inline-flex; align-items: center; gap: 7px; margin: 16px 18px 0; color: #71717a; font-size: 12px; font-weight: 550; text-decoration: none; transition: color .16s ease; }
.shop-detail-back span { font-size: 15px; line-height: 1; }
.shop-detail-back:hover, .shop-detail-back:focus-visible { color: #18181b; }
.shop-detail-actions { display: flex; align-items: center; }
.shop-detail-actions .button { white-space: nowrap; }
.shop-detail-actions .button:disabled { cursor: default; opacity: .58; }
.shop-detail-table { min-width: 760px; }
.shop-detail-table th, .shop-detail-table td { text-align: center; }
.shop-detail-table th:first-child, .shop-detail-table td:first-child { text-align: left; }
.shop-detail-link { display: inline-flex; align-items: center; gap: 7px; color: var(--ink); font-weight: 650; text-decoration: none; }
.shop-detail-link span { color: var(--muted); font-size: 11px; opacity: 0; transition: opacity .16s ease; }
.shop-detail-link:hover { color: var(--accent); }
.shop-detail-link:hover span, .shop-detail-link:focus-visible span { opacity: 1; }
.monitor-status { display: inline-flex; padding: 4px 8px; border-radius: 999px; background: #e9f6f0; color: #168463; font-size: 11px; font-weight: 650; }
.monitor-status.paused { background: #f4f4f5; color: #71717a; }
.monitor-status.unmonitored { background: #f4f4f5; color: #71717a; }
.monitor-status.violation { background: #fee4e2; color: #b42318; }
.shop-monitor-action { min-width: 92px; }
.shop-management-table { min-width: 950px; }
.shop-management-table td:last-child { text-align: center; }
@media (max-width: 1180px) { .selection-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 760px) { .selection-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; } .selection-page-head, .shop-leaderboard-panel > .panel-head { align-items: flex-start; } }
@media (max-width: 420px) { .selection-grid { grid-template-columns: 1fr; } }

/* Keep accordion destinations available when the desktop sidebar is reduced to an icon rail. */
@media (min-width: 621px) {
  .sidebar-collapsed .sidebar-selection-library,
  .sidebar-collapsed .sidebar-my-selection { position: relative; }
  .sidebar-collapsed .sidebar-selection-library > summary,
  .sidebar-collapsed .sidebar-my-selection > summary { justify-content: center; gap: 0; padding-inline: 0; }
  .sidebar-collapsed .sidebar-selection-library > summary > span:not(.sidebar-group-icon),
  .sidebar-collapsed .sidebar-my-selection > summary > span:not(.sidebar-group-icon) { display: none; }
  .sidebar-collapsed .sidebar-selection-library > summary > .sidebar-group-icon,
  .sidebar-collapsed .sidebar-my-selection > summary > .sidebar-group-icon { width: 18px; flex: 0 0 18px; }
  .sidebar-collapsed .sidebar-selection-library > summary > .sidebar-group-icon svg,
  .sidebar-collapsed .sidebar-my-selection > summary > .sidebar-group-icon svg { width: 18px; height: 18px; }
  .sidebar-collapsed .sidebar-group-links,
  .sidebar-collapsed .my-selection-links { position: absolute; z-index: 25; top: 0; left: calc(100% + 8px); width: 190px; display: none; gap: 3px; margin: 0; padding: 7px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.1); }
  .sidebar-collapsed .sidebar-selection-library:hover > .sidebar-group-links,
  .sidebar-collapsed .sidebar-selection-library:focus-within > .sidebar-group-links,
  .sidebar-collapsed .sidebar-my-selection:hover > .my-selection-links,
  .sidebar-collapsed .sidebar-my-selection:focus-within > .my-selection-links { display: grid; }
  .sidebar-collapsed .sidebar nav .my-selection-links a,
  .sidebar-collapsed .sidebar nav .sidebar-group-links a { min-height: 34px; justify-content: flex-start; padding: 0 10px; border-radius: 5px; color: #52525b; font-size: 12px; }
}

.tutorial-modal { width: min(520px,calc(100% - 28px)); padding: 0; border: 1px solid #e4e4e7; border-radius: 14px; color: var(--ink); box-shadow: 0 24px 80px #18181b2e; }
.tutorial-modal::backdrop { background: #18181b80; backdrop-filter: blur(3px); }
.tutorial-content { padding: 25px; }
.tutorial-step { padding: 14px 0 8px; }
.tutorial-step p { margin: 0; color: #71717a; font-size: 13px; line-height: 1.8; }
.tutorial-tip { margin-top: 17px; padding: 11px 13px; border-radius: 8px; background: #f7f7f8; color: #52525b; font-size: 11px; line-height: 1.7; }
.tutorial-actions { display: flex; align-items: center; gap: 10px; padding-top: 18px; border-top: 1px solid #f0f0f2; }
.tutorial-actions .tutorial-skip { margin-right: auto; border: 0; background: transparent; color: #71717a; font-size: 11px; cursor: pointer; }
@media (max-width: 520px) { .tutorial-content { padding: 20px; } .tutorial-actions { gap: 7px; } }

@media (max-width: 900px) {
  #page-content { padding: 20px 18px 36px; }
  .metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .home-chart-svg { height: 230px; }
}
@media (max-width: 620px) {
  .shell { display: block; }
  .shell.sidebar-collapsed { display: block; }
  .sidebar-collapsed .sidebar { padding: 13px 13px 10px; }
  .sidebar-collapsed .brand { justify-content: flex-start; padding: 0 4px 10px; }
  .sidebar-collapsed .brand > span:last-child { display: block; }
  .sidebar-collapsed .sidebar nav a { justify-content: flex-start; padding: 0 10px; font-size: 12px; }
  .sidebar-collapsed .sidebar nav a span { font-size: 15px; }
  .sidebar-collapsed .sidebar-tools summary { justify-content: flex-start; padding-inline: 10px; }
  .sidebar-collapsed .sidebar-tools summary > span:not(.tools-icon) { display: inline; }
  .sidebar-collapsed .sidebar-tool-links { position: static; width: auto; padding: 0 0 5px 28px; border: 0; box-shadow: none; }
  .sidebar { position: static; width: 100%; height: auto; padding: 13px 13px 10px; display: block; border-right: 0; border-bottom: 1px solid var(--line); }
  .brand { justify-content: flex-start; margin: 0; padding: 0 4px 10px; }
  .brand > span:last-child { display: block; }
  .sidebar-caption { display: none; }
  .sidebar nav { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sidebar nav a { justify-content: flex-start; padding: 0 10px; font-size: 12px; }
  .sidebar nav a span { font-size: 15px; }
  .sidebar-tools { margin-top: 7px; border-top: 0; }
  .sidebar-tools summary { justify-content: flex-start; padding-inline: 10px; }
  .sidebar-tools summary > span:not(.tools-icon) { display: inline; }
  .sidebar-tool-links { position: static; width: auto; padding: 0 0 5px 28px; border: 0; box-shadow: none; }
  .sidebar-note { display: none; }
  .app-topbar { min-height: 60px; padding: 0 12px; gap: 8px; }
  .app-topbar-heading { gap: 7px; }
  .app-topbar-heading .eyebrow { display: none; }
  .app-topbar h1 { max-width: 38vw; font-size: 13px; }
  .app-topbar-actions { gap: 1px; }
  .app-topbar-actions .topbar-icon { display: none; }
  .topbar-avatar { display: none; }
  .app-topbar .button.primary { min-height: 32px; padding-inline: 9px; font-size: 11px; }
  .app-topbar .tutorial-launch { min-height: 32px; padding-inline: 8px; font-size: 10px; }
  #page-content { padding: 16px 12px 30px; }
  .metrics { gap: 9px; }
  .metrics article { min-height: 113px; padding: 13px; }
  .home-trend-card { padding-inline: 10px; }
  .home-trend-card .home-panel-head { padding-inline: 8px; }
  .home-chart-svg { height: 205px; }
  .dashboard-card .home-panel-head { padding-inline: 14px; }
  .home-recent-list, .home-activity-list { padding-inline: 14px; }
}

.selection-pagination { display: flex; justify-content: center; align-items: center; gap: 16px; margin-top: 20px; }
.selection-pagination[hidden] { display: none; }

/* Shop collection uses the same dialog, typography and buttons as product editing. */
.shop-job-panel { width: min(660px, calc(100vw - 28px)); max-height: calc(100dvh - 48px); }
.shop-job-content { padding: 24px; }
.shop-job-panel [hidden] { display: none !important; }
.shop-job-panel .shop-job-form { padding: 0; display: grid; gap: 10px; }
.shop-job-form textarea { width: 100%; min-height: 90px; resize: vertical; font: inherit; }
.shop-job-form-footer, .shop-job-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.shop-job-panel small { color: var(--muted); font-size: 12px; line-height: 1.6; }
.shop-job-panel [data-job-status]:not(:empty) { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.shop-job-heading span { color: var(--muted); font-size: 12px; }
.shop-job-panel progress { display: block; width: 100%; height: 7px; margin: 12px 0; accent-color: var(--red); }
.shop-job-panel p { margin: 10px 0; font-size: 13px; }
.shop-job-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 16px 0; }
.shop-job-stats article { padding: 12px; border: 1px solid var(--line); border-radius: 6px; }
.shop-job-stats span { display: block; color: var(--muted); font-size: 12px; }
.shop-job-stats strong { display: block; font-size: 23px; margin-top: 6px; }
.shop-job-error, .shop-job-panel [role=alert] { color: #b91c1c; }
.shop-job-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.shop-job-panel summary { cursor: pointer; padding: 14px 0; font-size: 13px; color: var(--muted); }
.shop-job-panel .table-wrap { max-height: 240px; overflow: auto; }
.shop-job-panel table { min-width: 0; width: 100%; }
.shop-job-panel td { padding: 10px 8px; font-size: 12px; }
.shop-job-panel td:first-child { width: 55%; white-space: normal; overflow-wrap: anywhere; }
.shop-job-panel td small { display: block; overflow-wrap: anywhere; }
.shop-job-panel [data-monitor-status] { padding: 12px; margin-top: 16px; background: var(--canvas); border-radius: 6px; font-size: 13px; }
@media (max-width: 640px) { .shop-job-content { padding: 18px; } .shop-job-form-footer { align-items: flex-start; } .shop-job-heading { align-items: flex-start; } }

.shop-collection-state { margin-top: 18px; padding: 12px 14px; border-radius: 6px; font-weight: 650; font-size: 14px; }
.shop-collection-state[data-state="running"] { color: var(--blue); background: #edf4ff; }
.shop-collection-state[data-state="success"] { color: var(--green); background: #eaf7f1; }
.shop-collection-state[data-state="failed"] { color: var(--red); background: #fff0f2; }

/* Keep the subscription link centered like native header buttons. */
.app-topbar .membership-purchase-link { display: inline-flex; align-items: center; justify-content: center; text-align: center; line-height: 1; white-space: nowrap; }

.toolza-announcement{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#fff7eb;border:1px solid #f1dfc3;border-radius:8px;padding:14px 18px;margin-bottom:20px;font-size:12px;color:#936a35}.toolza-announcement a{margin-left:auto;color:#8e4b39}.toolza-notice-page{max-width:840px;box-sizing:border-box;padding:50px 26px;margin:0 auto}.toolza-notice-page h1{font-size:27px;margin:28px 0 12px}.toolza-notice-meta{color:#9b7747;font-size:12px}.toolza-notice-body{white-space:pre-wrap;line-height:2;font-size:15px;margin:30px 0;color:#535b67}.toolza-notice-page>a{font-size:13px;color:#b53652}

.toolza-notice-card{box-sizing:border-box;width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid #e6e7ec;border-radius:16px;padding:24px;background:#fff;color:#333944;box-shadow:0 24px 80px #18223533}.toolza-notice-card::backdrop{background:#20263466;backdrop-filter:blur(2px)}.toolza-notice-top{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#9b6c7b}.toolza-notice-top button{display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:50%;background:#f4f5f7;color:#737c89;font-size:22px;cursor:pointer}.toolza-notice-card h2{font-size:20px;line-height:1.4;margin:13px 0 8px}.toolza-notice-card .toolza-notice-meta{margin:0 0 17px;font-size:11px;color:#929aa5}.toolza-notice-card-body{white-space:pre-wrap;font-size:13px;line-height:1.8;color:#656e7d;max-height:340px;overflow-y:auto;padding-right:6px}.toolza-notice-ack{width:100%;display:block;border:0;border-radius:7px;background:#d92e4b;color:white;min-height:40px;font-size:13px;margin-top:22px;cursor:pointer}.toolza-notice-reopen{position:fixed;right:24px;bottom:24px;z-index:50;padding:12px 18px;border:1px solid #e3c4cc;border-radius:8px;background:white;color:#a64960;cursor:pointer}@media(max-width:640px){.toolza-notice-card{padding:21px}.toolza-notice-card-body{max-height:calc(100dvh - 240px)}.toolza-notice-card h2{font-size:18px}}

/* Compact announcement card, matching Toolza's neutral interface. */
.toolza-notice-card{width:min(440px,calc(100vw - 36px));padding:28px 30px;border-radius:14px;border-color:#e8e9ec;box-shadow:0 18px 70px #18202d26}.toolza-notice-card::backdrop{background:#21252d42;backdrop-filter:blur(4px)}.toolza-notice-top{color:#555d69;font-size:12px}.toolza-notice-brand{display:flex;align-items:center;gap:8px;font-weight:650}.toolza-notice-brand i{display:grid;place-items:center;width:25px;height:25px;border-radius:6px;background:#202126;color:white;font-size:14px;font-style:normal}.toolza-notice-brand em{font-size:10px;font-style:normal;color:#979da7;font-weight:400;border-left:1px solid #e4e6ea;padding-left:9px;margin-left:2px}.toolza-notice-top button{background:transparent;color:#a3a8b1;font-size:20px}.toolza-notice-card h2{font-size:22px;font-weight:650;letter-spacing:-.6px;margin:24px 0 8px;color:#252931}.toolza-notice-card .toolza-notice-meta{font-size:11px;color:#a0a6af;margin-bottom:24px}.toolza-notice-card-body{max-height:none;overflow:visible;white-space:normal;padding:0;font-size:13px;line-height:1.85;color:#7d8592}.toolza-notice-card-body p{margin:0 0 16px}.toolza-notice-card-body p:last-child{font-size:11px;color:#a0a6b0;line-height:1.75;margin-bottom:0}.toolza-notice-card-body strong{font-weight:600;color:#454d5a}.toolza-notice-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:25px;padding-top:20px;border-top:1px solid #f0f1f3}.toolza-notice-bottom>span{font-size:10px;color:#b0b5bd}.toolza-notice-bottom .toolza-notice-ack{width:auto;min-height:34px;min-width:88px;margin:0;padding:0 20px;background:#23252b;border-radius:6px;font-size:12px}.toolza-notice-ack:hover{background:#383b43}@media(max-width:640px){.toolza-notice-card{padding:24px}.toolza-notice-card h2{font-size:20px}.toolza-notice-card-body{max-height:none;font-size:12px}.toolza-notice-card-body p{margin-bottom:14px}}

.toolza-notice-card button:focus-visible{outline:2px solid #c1c6cf;outline-offset:3px}
/* Followed shops and the full in-library catalog for a single shop. */
.shop-browser-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 0 18px 16px; }
.shop-browser-toolbar .search-box { flex: 1; min-width: 220px; }
.shop-sort-label { display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: 12px; }
.shop-sort-label select { max-width: 100%; padding: 9px 12px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--ink); font: inherit; }
.shop-overview { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; padding: 0 18px 24px; }
.shop-overview article { padding: 16px; background: #fafafa; border: 1px solid var(--line); border-radius: 10px; }
.shop-overview small, .shop-overview strong { display: block; }
.shop-overview small { color: var(--muted); font-size: 12px; }
.shop-overview strong { margin-top: 9px; font-size: 23px; font-variant-numeric: tabular-nums; }
.shop-overview .shop-overview-time { font-size: 17px; line-height: 28px; }
.shop-filter-row { justify-content: space-between; }
.shop-filter-row .segmented { flex-wrap: wrap; }
.shop-batch-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; min-height: 56px; padding: 10px 18px; background: #fafafa; border-block: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.shop-batch-bar button:disabled { opacity: .5; cursor: default; }
.product-batch-toolbar { min-height: 40px; padding: 5px 13px; gap: 10px; }
.product-batch-toolbar label { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; white-space: nowrap; }
.product-batch-toolbar input[type="checkbox"], #products .product-select-column input[type="checkbox"] { accent-color: var(--red); }
#product-batch-result { flex: 1 1 220px; }
#products th.product-select-column, #products td.product-select-column { width: 54px; min-width: 54px; text-align: center; }
#products td.product-select-column input { width: 15px; height: 15px; vertical-align: middle; }
.shop-detail-table th:first-child, .shop-detail-table td:first-child { width: 44px; text-align: center; }
.shop-detail-table th:nth-child(3), .shop-detail-table td:nth-child(3) { text-align: left; }
.shop-product-rank { width: 54px; font-weight: 700; font-variant-numeric: tabular-nums; }
.shop-detail-table .product-cell { min-width: 230px; max-width: 420px; }
.shop-detail-table .shop-detail-link { line-height: 1.6; }
.shop-detail-table td > small { display: block; margin-top: 5px; font-size: 10px; }
.shop-catalog-note { padding: 0 18px; color: var(--muted); font-size: 11px; line-height: 1.8; }
.shop-pagination { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 16px 18px; color: var(--muted); font-size: 12px; }
.shop-pagination[hidden] { display: none; }
.shop-row-actions { display: flex; align-items: center; justify-content: center; gap: 14px; white-space: nowrap; font-size: 12px; }
.shop-more { position: relative; }
.shop-more summary { cursor: pointer; color: var(--muted); }
.shop-more button { position: absolute; right: 0; bottom: 100%; z-index: 2; width: 128px; padding: 10px; border: 1px solid var(--line); background: #fff; border-radius: 6px; box-shadow: var(--shadow); color: var(--red); cursor: pointer; }
@media (max-width: 760px) {
  .shop-overview { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .shop-overview strong { font-size: 20px; }
  .shop-browser-toolbar .search-box { flex-basis: 100%; }
  .shop-filter-row .segmented button { padding: 8px; font-size: 11px; }
  .shop-detail-head { gap: 12px; }
}

.shop-detail-table input[type="checkbox"] { width: 16px; height: 16px; min-height: 0; margin: 0; padding: 0; accent-color: #18181b; vertical-align: middle; }

/* Single-product sales: fixed calendar buckets, signed deltas and observable rollbacks. */
#product-trend-root { display: grid; gap: 18px; min-width: 0; }
.pt-panel { padding: 24px 24px 16px; }
.pt-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.pt-heading h2 { margin: 0; color: var(--ink); font-size: 18px; font-weight: 650; }
.pt-heading p { display: flex; flex-wrap: wrap; gap: 12px; margin: 8px 0 0; font-size: 12px; color: var(--muted); line-height: 1.6; }
.pt-heading p span { color: #a1a1aa; }
.pt-modes { display: inline-flex; gap: 3px; padding: 4px; border: 1px solid #e4e4e7; border-radius: 9px; background: #f4f4f5; }
.pt-modes button, .pt-ranges button { padding: 8px 14px; border: 0; border-radius: 6px; background: transparent; color: #71717a; font-size: 12px; cursor: pointer; white-space: nowrap; }
.pt-modes button[aria-pressed="true"] { background: #fff; color: #18181b; box-shadow: 0 1px 4px #18181b12; font-weight: 650; }
.pt-modes button:focus-visible, .pt-ranges button:focus-visible, .pt-records tr:focus-visible { outline: 2px solid #71717a; outline-offset: 2px; }
.pt-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; margin: 24px 0 20px; }
.pt-ranges { display: flex; flex-wrap: wrap; gap: 4px; }
.pt-ranges button { padding: 7px 13px; border: 1px solid transparent; }
.pt-ranges button[aria-pressed="true"] { background: #fff1f3; color: #d92e4b; border-color: #f8d7df; font-weight: 650; }
.pt-legend { display: flex; align-items: center; gap: 15px; font-size: 11px; color: #71717a; }
.pt-legend span { display: inline-flex; align-items: center; gap: 6px; }
.pt-legend i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; }
.pt-legend-main { background: #dd3957; }
.pt-legend-rollback { background: #e78928; border-radius: 50% !important; }
.pt-legend-missing { border: 1px dashed #a1a1aa; }
.pt-custom { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 0 0 18px; padding: 14px; background: #fafafa; border-radius: 8px; }
.pt-custom label { display: grid; gap: 5px; color: #71717a; font-size: 11px; }
.pt-custom input { width: 155px; height: 34px; min-height: 0; font-size: 12px; padding: 6px 8px; }
.pt-custom > span { align-self: center; font-size: 11px; color: #a1a1aa; }
.pt-summary { display: grid; grid-template-columns: 1.2fr 1fr .85fr 1.2fr; margin-bottom: 24px; padding: 18px 0; border-block: 1px solid #f0f0f2; }
.pt-summary > div { padding: 0 20px; border-right: 1px solid #ededf0; }
.pt-summary > div:first-child { padding-left: 0; }
.pt-summary > div:last-child { border: 0; }
.pt-summary small { display: block; color: #71717a; font-size: 11px; }
.pt-summary strong { display: block; margin-top: 9px; color: #18181b; font-size: 24px; line-height: 1.2; font-weight: 650; font-variant-numeric: tabular-nums; }
.pt-summary em { margin-left: 6px; font-size: 11px; font-style: normal; color: #a1a1aa; font-weight: 400; }
.pt-summary .pt-latest { font-size: 15px; line-height: 29px; font-weight: 500; }
.pt-chart { position: relative; min-width: 0; }
.pt-svg { width: 100%; height: 300px; display: block; overflow: visible; }
.pt-grid { stroke: #eeeef1; stroke-dasharray: 3 4; stroke-width: 1; }
.pt-zero { stroke: #c4c4cb; stroke-width: 1; }
.pt-axis { fill: #92929d; font: 11px "Avenir Next", "PingFang SC", sans-serif; }
.pt-axis-title { fill: #71717a; }
.pt-line { stroke: #dd3957; fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.pt-point { fill: #dd3957; stroke: #fff; stroke-width: 2; }
.pt-point.rollback { fill: #e78928; stroke: #fff; stroke-width: 2; }
.pt-point.partial { opacity: .5; }
.pt-missing-mark { stroke: #a1a1aa; stroke-width: 2; stroke-dasharray: 2 2; }
.pt-target { fill: transparent; cursor: crosshair; outline: none; }
.pt-target:focus-visible { fill: #18181b05; stroke: #a1a1aa; stroke-width: 1; }
.pt-crosshair { stroke: #a1a1aa; stroke-width: 1; stroke-dasharray: 4 3; pointer-events: none; }
.pt-tooltip { position: absolute; top: 8px; z-index: 3; width: 250px; max-width: calc(100% - 8px); padding: 14px; background: #fff; border: 1px solid #e4e4e7; box-shadow: 0 8px 28px #18181b16; border-radius: 10px; color: #18181b; pointer-events: none; font-size: 11px; }
.pt-tooltip[hidden] { display: none; }
.pt-tooltip > b { display: block; font-size: 12px; }
.pt-tooltip dl { display: grid; grid-template-columns: auto auto; gap: 9px; margin: 14px 0 0; }
.pt-tooltip dt { color: #71717a; }
.pt-tooltip dd { margin: 0; text-align: right; font-weight: 600; }
.pt-tooltip p { border-top: 1px solid #f1f1f3; padding-top: 10px; margin: 12px 0 0; color: #ba6418; line-height: 1.8; }
.pt-tooltip p span { display: block; }
.pt-tooltip > small { display: block; margin-top: 10px; font-size: 10px; line-height: 1.6; color: #a1a1aa; }
.pt-caption { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; color: #92929d; font-size: 11px; line-height: 1.7; padding-top: 12px; }
.pt-caption > span:last-child { white-space: nowrap; }
.pt-rollback-note { display: flex; align-items: baseline; gap: 7px; margin: 12px 0 0; padding: 10px 12px; background: #fff9f1; color: #a86a24; border-radius: 6px; font-size: 11px; line-height: 1.6; }
.pt-rollback-note i { display: inline-block; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #e78928; }
.pt-orange { color: #ba6418 !important; }
.pt-positive { color: #168463; }
.pt-empty { min-height: 260px; display: flex; gap: 14px; flex-direction: column; align-items: center; justify-content: center; color: #71717a; font-size: 13px; }
.pt-no-values { position: absolute; inset: 75px 30px auto 65px; padding: 18px; color: #71717a; text-align: center; font-size: 12px; pointer-events: none; }
.pt-records { min-width: 0; overflow: hidden; }
.pt-records > .pt-heading { padding: 22px 24px; }
.pt-table-scroll, .pt-raw-scroll { max-height: 425px; overflow: auto; }
.pt-records table { width: 100%; min-width: 680px; }
.pt-records thead { position: sticky; top: 0; z-index: 1; background: #fafafa; }
.pt-records th, .pt-records td { padding: 13px 24px; text-align: right; font-size: 12px; }
.pt-records th { color: #92929d; font-size: 11px; font-weight: 500; }
.pt-records th:first-child, .pt-records td:first-child { text-align: left; }
.pt-records td small { display: inline-block; margin-left: 8px; font-size: 10px; color: #a1a1aa; }
.pt-records tr[data-trend-row] { cursor: pointer; }
.pt-records tr[data-trend-row]:hover, .pt-records tr.selected { background: #fafafa; }
.pt-state { display: inline-flex; padding: 3px 7px; border-radius: 4px; font-size: 10px; background: #f4f4f5; color: #71717a; margin-left: 4px; white-space: nowrap; }
.pt-state.missing { color: #a1a1aa; background: transparent; }
.pt-state.rollback { color: #ba6418; background: #fff3e1; }
.pt-raw { padding: 18px 0 0; border-top: 1px solid #e4e4e7; }
.pt-raw-head { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 0 24px 16px; font-size: 12px; }
.pt-raw-head span { color: #92929d; }
@media (max-width: 700px) {
  .pt-panel { padding: 18px 14px 14px; }
  .pt-heading { flex-wrap: wrap; }
  .pt-modes button, .pt-ranges button { padding: 7px 10px; }
  .pt-toolbar { margin: 18px 0; }
  .pt-summary { grid-template-columns: 1fr 1fr; row-gap: 20px; }
  .pt-summary > div:nth-child(2) { border: 0; }
  .pt-summary > div:nth-child(3) { padding-left: 0; }
  .pt-summary strong { font-size: 21px; }
  .pt-records > .pt-heading { padding: 18px 14px; }
  .pt-caption > span:last-child { display: none; }
}

/* Compact totals share the product count row and use the current list filters. */
.product-table-meta { align-items: center; gap: 16px; flex-wrap: wrap; }
.product-meta-summary { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; min-width: 0; }
.product-meta-summary #product-count { padding-right: 18px; border-right: 1px solid var(--line); white-space: nowrap; }
.product-growth-summary { display: flex; align-items: baseline; gap: 22px; flex-wrap: wrap; }
.product-growth-summary > span { display: inline-flex; align-items: baseline; gap: 7px; white-space: nowrap; font-size: 11px; }
.product-growth-summary b { font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; color: #505967; }
.product-growth-summary b.positive { color: var(--green); }
.product-growth-summary b.negative { color: var(--red); }
.product-summary-help { position: relative; }
.product-summary-help summary { list-style: none; cursor: pointer; padding: 4px; color: #969eaa; font-size: 14px; line-height: 1; border-radius: 4px; }
.product-summary-help summary::-webkit-details-marker { display: none; }
.product-summary-help summary:hover, .product-summary-help summary:focus-visible { color: var(--ink); background: #f1f3f6; }
.product-summary-popover { position: absolute; z-index: 20; top: calc(100% + 8px); right: 0; width: 280px; max-width: 85vw; padding: 14px 16px; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 5px 20px #26304714; color: var(--muted); font-size: 12px; line-height: 1.8; }
.product-summary-popover strong { color: var(--ink); font-weight: 600; }
.product-summary-popover p { margin: 6px 0; }
.product-summary-popover small { display: block; padding-top: 8px; margin-top: 8px; border-top: 1px solid var(--line); font-size: 11px; }
#products.table-panel { overflow: visible; }
.product-table-meta > .sort-control { margin-left: auto; }
@media (max-width: 600px) {
  .product-growth-summary { gap: 12px; }
  .product-summary-help { position: static; }
  .product-meta-summary { position: relative; }
}

.product-monitoring-capacity{display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px;padding:14px 22px;border-bottom:1px solid var(--border,#e5e7eb);font-size:13px}.product-monitoring-capacity span{color:#697386}.product-monitoring-capacity a{color:#4f46e5}.product-monitoring-capacity b{flex-basis:100%;color:#a15c00}.product-monitor-note{color:#697386;font-size:13px}#product-table-body td>small{display:block;max-width:190px;margin:5px 0;font-size:11px;color:#7b8494}

#products td:nth-child(9) small,#products td:nth-child(10) small{white-space:normal;overflow-wrap:anywhere;line-height:1.5}#products .row-actions button{flex-shrink:0}

.shop-monitor-tabs{margin:12px 20px;display:inline-flex}.shop-management-table td:first-child{width:60px}.shop-management-table td{white-space:normal}.shop-management-table .shop-row-actions{gap:10px}.shop-management-table td small{line-height:1.5}#shop-follow-form input{padding:10px 12px;border:1px solid #e4e7eb;border-radius:8px}

.shop-management-table th:nth-child(2),.shop-management-table td:nth-child(2){text-align:left}.shop-management-table th:first-child{white-space:nowrap}

/* Low-follower product discovery */
.low-follower-filters { display: flex; flex-wrap: wrap; gap: 16px; align-items: end; padding: 18px; margin-bottom: 18px; }
.low-follower-filters[hidden] { display: none; }
.low-follower-filters label, .low-follower-filters fieldset { display: grid; gap: 8px; font-size: 13px; color: var(--muted, #687389); }
.low-follower-filters fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.low-follower-filters legend { margin-bottom: 8px; }
.low-follower-filters select, .low-follower-price input { border: 1px solid var(--line, #e3e7ef); border-radius: 8px; min-height: 40px; background: white; padding: 8px 10px; color: var(--ink, #202b42); font: inherit; }
.low-follower-price { display: flex; align-items: center; gap: 8px; }
.low-follower-price input { width: 100px; }

.low-follower-page{gap:16px}
.low-follower-page .selection-page-head{padding:4px 0 8px;background:none;border:0;box-shadow:none}
.low-follower-page .eyebrow{color:#8c8c96;font-size:11px;letter-spacing:1px;font-weight:500}
.low-follower-page .selection-page-head h2{font-size:27px;letter-spacing:-.6px;margin:7px 0 0}
.low-follower-page .selection-page-head>div>p:last-child{font-size:13px;margin-top:8px}
.low-follower-page .coverage-chip{background:white}
.low-follower-page .low-follower-filters{gap:10px;margin:0;padding:16px;align-items:center;box-shadow:none}
.low-follower-page .low-follower-filters .search-box{flex:1;min-width:180px;height:38px}
.low-follower-page .low-follower-filters label:not(.search-box),.low-follower-page .low-follower-filters fieldset{display:flex;align-items:center;gap:8px;font-size:12px}
.low-follower-page .low-follower-filters legend{float:left;margin:0 8px 0 0;line-height:38px}
.low-follower-page .low-follower-filters select,.low-follower-page .low-follower-price input{min-height:38px;height:38px;padding:6px 8px;font-size:12px}
.low-follower-page .low-follower-price input{width:66px}
.low-follower-page .low-follower-filters .button{min-height:38px;height:38px}
.ranking-rules{display:flex;gap:16px;flex-wrap:wrap;color:#93939e;font-size:11px;margin:-5px 2px 0}
.ranking-rules span:not(.rule-note)::before{content:'✓';margin-right:5px;color:#a4a4ad}
.rule-note{margin-left:auto}
.low-follower-page .selection-category-filters{margin:3px 0 0;align-items:center}
.low-follower-page .selection-count{margin-left:auto}
.low-follower-page .selection-grid{gap:18px;grid-template-columns:repeat(4,minmax(0,1fr))}
.low-follower-page .selection-card{border-radius:12px;box-shadow:0 2px 5px #18181b03}
.low-follower-page .selection-card-cover{aspect-ratio:1.5}
.low-follower-page .selection-card-body{padding:14px;gap:10px}
.low-follower-page .selection-card-body h3{font-size:13px;line-height:1.55;min-height:40px;height:40px}
.low-follower-page h3 a{color:#29292f;text-decoration:none}
.low-follower-page .selection-card-meta{align-items:center;font-size:11px}
.low-follower-page .selection-card-meta b{font-size:15px;color:#303039}
.low-follower-page .low-follower-highlight{display:grid;grid-template-columns:1fr 1fr 1fr;background:#f8f8fa;padding:12px 10px;gap:8px;border-radius:8px;margin-top:2px}
.low-follower-page .low-follower-highlight span{font-size:10px;color:#8c8c97;white-space:nowrap}
.low-follower-page .low-follower-highlight strong{display:block;font-size:19px;color:#36363f;font-variant-numeric:tabular-nums;margin-top:6px;line-height:1.2}
.low-follower-page .low-follower-highlight .sales-primary strong{color:#e52d51}
.low-follower-page .low-follower-updated{font-size:10px;margin:0;color:#a0a0aa}
.ranking-actions{display:grid;grid-template-columns:1fr 1.1fr;gap:8px;margin-top:2px}
.ranking-actions .button{display:flex;align-items:center;justify-content:center;width:100%;height:36px;min-height:36px;padding:0 6px;margin:0;font-size:12px;text-decoration:none;border-radius:7px}
.ranking-actions .low-follower-trend{color:#595963;background:white}
.ranking-actions .primary{box-shadow:none}
.low-follower-page .selection-rank{background:#27272ad9;border:0}
.low-follower-page .selection-rank.top-1{background:#e72f51}
.low-follower-page .selection-rank.top-2,.low-follower-page .selection-rank.top-3{background:#55555ee6}
@media(max-width:1250px){.low-follower-page .selection-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.low-follower-page .low-follower-filters .search-box{flex-basis:100%}}
@media(max-width:800px){.low-follower-page .selection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.low-follower-page .low-follower-filters label:not(.search-box),.low-follower-page .low-follower-filters fieldset{width:auto}.rule-note{margin-left:0}}
@media(max-width:480px){.low-follower-page .selection-grid{grid-template-columns:1fr}.low-follower-page .selection-page-head{flex-wrap:wrap;gap:12px}.low-follower-page .selection-category-filters{gap:6px}.low-follower-page .selection-count{flex-basis:100%;margin:4px 0}.low-follower-page .selection-card-cover{aspect-ratio:1.65}}

.low-follower-page .low-follower-filters .search-box { display: flex; align-items: center; gap: 8px; }
.low-follower-page .low-follower-filters .search-box input { min-width: 0; width: 100%; }
.low-follower-results { display: flex; align-items: center; gap: 12px; }
.low-follower-results .selection-category-filters { flex: 1; }
.low-follower-page [hidden] { display: none !important; }
@media (max-width: 480px) { .low-follower-results { flex-wrap: wrap; } }

/* One membership card shared by every sidebar route, including loading states. */
#membership-sidebar-card .membership-quota-card{display:block;width:100%;padding:16px;margin:10px 0;background:#f7f7f9;border:1px solid #e3e3e8;border-radius:8px;color:#33353d;text-align:left;text-decoration:none;font-family:inherit;box-sizing:border-box}
.membership-quota-title{display:flex;gap:8px;align-items:center;font-size:13px}
.membership-quota-title>span{margin-left:auto;color:#858994}
.membership-quota-card small{display:flex;justify-content:space-between;font-size:10px;color:#90939e;margin-top:13px;line-height:15px;white-space:nowrap}
.membership-quota-card [data-membership-detail]{display:block;overflow:hidden;text-overflow:ellipsis}
.membership-quota-card strong{color:#545967;font-weight:500}
.membership-quota-card em{display:block;border-top:1px solid #e4e5eb;padding-top:10px;margin-top:13px;font-size:11px;font-style:normal;color:#656c79}
.membership-quota-track{height:3px;background:#e5e5eb;margin-top:8px;border-radius:9px;overflow:hidden}
.membership-quota-track i{display:block;height:100%;background:#d92e4b}
.membership-quota-card:focus-visible{outline:2px solid #d92e4b;outline-offset:3px}
.sidebar-collapsed #membership-sidebar-card{display:none}
@media(max-width:760px){#membership-sidebar-card{display:none}}

#shops .shop-sort-label[hidden], #shop-search-status[hidden], #shop-search-clear[hidden] { display: none; }

/* Keep ranking metadata in the existing header, without adding a toolbar. */
.ranking-rules[hidden] { display: none; }
@media (max-width: 760px) { .selection-page-head { flex-wrap: wrap; gap: 12px; } }

/* Help center */
#help-center-root { display:grid; gap:20px; max-width:1160px; margin:0 auto; padding:20px 0 48px; color:var(--ink,#202b42); }
.help-hero,.help-guides,.help-announcements { min-width:0; padding:24px; background:#fff; border:1px solid var(--line,#e3e7ef); border-radius:14px; box-shadow:0 3px 14px #202b4208; }
.help-hero { display:flex; align-items:end; justify-content:space-between; gap:24px; background:linear-gradient(115deg,#fff 55%,#f7f8fa); }
.help-hero h2,.help-section-heading h2 { margin:5px 0 0; color:var(--ink,#202b42); font-size:25px; line-height:1.3; }
.help-intro { margin:10px 0 0; color:var(--muted,#687389); font-size:14px; }
.help-quick-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:17px; }
.help-quick-actions .button,.help-guide-links .button { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 14px; text-decoration:none; }
.help-hero .button.primary,.help-notice-dialog .button.primary { border-color:#242833; background:#242833; color:#fff; box-shadow:none; }
.help-hero .button.primary:hover,.help-notice-dialog .button.primary:hover { border-color:#3b404c; background:#3b404c; }
.help-search-form { display:flex; gap:8px; width:min(390px,44%); }
.help-search { flex:1; min-width:0; height:42px; padding:0 13px; border:1px solid var(--line,#dfe3eb); border-radius:8px; color:var(--ink,#202b42); font:inherit; }
.help-search-form .button { min-height:42px; }
.help-section-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:17px; }
.help-section-heading .eyebrow,.help-hero .eyebrow { margin:0; color:#999ca7; font-size:10px; font-weight:700; letter-spacing:1.1px; }
.help-categories { display:flex; gap:8px; overflow:auto; padding:0 0 12px; }
.help-category { flex:0 0 auto; padding:8px 13px; border:1px solid #e7e9ef; border-radius:20px; background:#fff; color:#697386; font:inherit; font-size:12px; cursor:pointer; }
.help-category.selected { border-color:#aeb4c0; background:#f1f2f4; color:#222631; }
.help-guide-list { display:grid; gap:9px; }
.help-guide { overflow:hidden; border:1px solid #e8eaf0; border-radius:10px; background:#fff; scroll-margin-top:24px; }
.help-guide[open] { border-color:#d9deea; box-shadow:0 2px 8px #202b4208; }
.help-guide-head { display:flex; align-items:center; gap:14px; padding:15px 17px; cursor:pointer; list-style:none; }
.help-guide-head::-webkit-details-marker { display:none; }
.help-guide-head::after { content:'＋'; margin-left:auto; color:#9299a8; font-size:17px; }
.help-guide[open] .help-guide-head::after { content:'−'; }
.help-guide-category { flex:0 0 auto; padding:4px 8px; border-radius:5px; background:#f4f5f8; color:#777f90; font-size:11px; }
.help-guide-title { color:#283249; font-size:14px; font-weight:600; line-height:1.55; }
.help-guide-answer { padding:0 18px 4px; color:#596477; font-size:13px; line-height:1.85; overflow-wrap:anywhere; }
.help-guide-answer p { margin:0 0 10px; }
.help-guide-answer ul { margin:0 0 12px; padding-left:21px; }
.help-guide-answer a,.help-inline-link { color:#303641; text-decoration:underline; text-underline-offset:2px; }
.help-guide-date,.help-announcement-date { display:block; margin:8px 18px 12px; color:#9a9fab; font-size:11px; }
.help-guide-image { display:block; width:auto; max-width:min(100%,720px); max-height:480px; margin:12px 18px; border:1px solid #e8eaf0; border-radius:8px; object-fit:contain; }
.help-guide-links { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:5px 18px 16px; }
.help-guide-permalink { color:#758095; font-size:12px; text-decoration:none; }
.help-guide-permalink:hover { color:#20242c; text-decoration:underline; }
.help-guide-copy,.help-mark-read { min-height:32px; padding:0 11px; border:1px solid #e1e5ed; border-radius:7px; background:#fff; color:#616b7e; font:inherit; font-size:11px; cursor:pointer; }
.help-guide-copy:hover,.help-mark-read:hover { border-color:#aeb4c0; color:#20242c; }
.help-unread-count { flex:0 0 auto; color:#404754; font-size:12px; }
.help-announcement-list { display:grid; gap:12px; }
.help-announcement { padding:16px 17px; border:1px solid #e8eaf0; border-radius:10px; }
.help-announcement.unread { border-color:#cfd3db; background:#fafbfc; }
.help-announcement h3 { margin:10px 0 8px; font-size:15px; line-height:1.5; }
.help-announcement-meta { display:flex; flex-wrap:wrap; gap:7px; }
.help-type-tag,.help-pinned,.help-unread-tag,.help-withdrawn { padding:4px 8px; border-radius:5px; background:#f3f4f7; color:#6e7789; font-size:10px; }
.help-unread-tag { background:#f0f1f4; color:#4e5665; }
.help-pinned { background:#fff6e9; color:#a66c16; }
.help-announcement-body { color:#5c667a; font-size:13px; line-height:1.8; overflow-wrap:anywhere; }
.help-announcement-body p { margin:7px 0; }
.help-announcement-body ul { margin:5px 0; padding-left:20px; }
.help-announcement .help-announcement-date { margin:12px 0 0; }
.help-empty,.help-error-note,.help-load-error { padding:12px; color:#798396; font-size:13px; }
.help-error-note { margin:0; border-radius:8px; background:#fff4f3; color:#aa2d35; }
.help-notice-dialog { width:min(480px,calc(100vw - 32px)); max-height:min(80vh,680px); padding:22px; border:1px solid #e5e7ec; border-radius:14px; color:var(--ink,#202b42); box-shadow:0 18px 70px #11182740; }
.help-notice-dialog::backdrop { background:#171c28a8; }
.help-popup-header,.help-popup-actions { display:flex; align-items:center; justify-content:space-between; gap:9px; }
.help-popup-header .close { width:34px; height:34px; border:0; border-radius:50%; background:#f3f4f7; color:#626b7c; font-size:20px; cursor:pointer; }
.help-notice-dialog h2 { margin:16px 0 9px; font-size:19px; line-height:1.45; }
.help-popup-body { max-height:46vh; overflow:auto; color:#596477; font-size:13px; line-height:1.8; }
.help-popup-actions { justify-content:flex-end; margin-top:16px; }
@media(max-width:760px) {
  #help-center-root { gap:13px; padding:12px 0 32px; }
  .help-hero,.help-guides,.help-announcements { padding:17px 15px; border-radius:11px; }
  .help-hero { align-items:stretch; flex-direction:column; gap:16px; }
  .help-hero h2,.help-section-heading h2 { font-size:21px; }
  .help-search-form { width:100%; }
  .help-section-heading { align-items:flex-start; }
  .help-guide-head { align-items:flex-start; gap:8px; padding:13px 12px; }
  .help-guide-category { margin-top:1px; font-size:10px; }
  .help-guide-title { font-size:13px; }
  .help-guide-answer { padding:0 13px 4px; font-size:12px; }
  .help-guide-image { max-height:340px; margin:10px 13px; }
  .help-guide-date { margin-left:13px; }
  .help-guide-links { padding-left:13px; padding-right:13px; }
}