.api-help {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: #eaf5ef;
  border: 1px solid #cfe5d8;
  border-radius: 12px;
  padding: 16px 18px;
  margin-bottom: 16px;
}
.api-help b { white-space: nowrap; font-size: .88rem; }
.api-help span { color: #50655a; font-size: .82rem; line-height: 1.5; }
.sidebar nav a, .page-head p, .button, .primary, .danger, .flash,
.status-line, .panel-head p, .product-row b, .order-list b,
.order-list strong, .store-card dl div, .token-form label,
.auth-card label, dialog label, .panel > label, .table-row,
input, textarea, select, .auth-card p { font-size: .86rem; }
.panel-head h2, .store-card h2 { font-size: 1.08rem; }
.product-row small, .order-list small, .store-menu small, .table-row small,
.application-list span, .application-list small, .user-list small { font-size: .74rem; }
.eyebrow, .kpis small, .kpis span, .panel-head a, .back, .auth-link { font-size: .76rem; }
.badge, .mini { font-size: .7rem; }
.store-actions { display: flex; justify-content: space-between; gap: 8px; margin-top: 10px; }
.delete-button { color: #b63f37; border-color: #eccbc8; }
.user-actions { display: flex; gap: 6px; }
.mini.delete-button { background: #fff8f7; }
.head-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; justify-content: flex-end; }
.catalog-note, .sync-note { background: #edf6f1; border: 1px solid #d5e7dc; border-radius: 11px; padding: 13px 16px; margin-bottom: 15px; color: #50665a; font-size: .82rem; line-height: 1.45; }
.sync-note { display: flex; align-items: center; gap: 9px; }
.periods { display: flex; background: #e8eeea; padding: 4px; border-radius: 9px; }
.periods a { padding: 8px 10px; border-radius: 7px; color: #687970; font-size: .74rem; font-weight: 700; }
.periods a.active { background: white; color: #175437; box-shadow: 0 2px 8px #1a3a2920; }
.analytics-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 14px; margin-bottom: 14px; }
.sales-chart { min-width: 0; }
.chart-bars { display: flex; height: 290px; align-items: flex-end; gap: 3px; border-bottom: 1px solid #dce6e0; padding-top: 35px; }
.chart-column { height: 100%; flex: 1; min-width: 3px; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; position: relative; }
.chart-bar { width: min(72%,22px); min-height: 3px; background: linear-gradient(180deg,#2dc77c,#158a57); border-radius: 5px 5px 1px 1px; transition: opacity .2s; }
.chart-column:hover .chart-bar { opacity: .72; }
.chart-column small { height: 22px; margin-top: 6px; color: #829087; font-size: .58rem; white-space: nowrap; }
.chart-value { position: absolute; bottom: calc(var(--bar-height, 0%) + 30px); display: none; font-size: .58rem; white-space: nowrap; }
.status-list > div { display: grid; grid-template-columns: 1fr auto; gap: 5px 10px; padding: 13px 2px; border-top: 1px solid #edf1ef; }
.status-list span { display: flex; align-items: center; gap: 8px; }
.status-list b, .status-list strong { font-size: .78rem; }
.status-list small { grid-column: 2; color: #7a8981; font-size: .7rem; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #29b973; }
.top-products { margin-top: 14px; }
.top-row { display: grid; grid-template-columns: 2fr 1fr .7fr 1fr; gap: 12px; padding: 12px 6px; border-top: 1px solid #edf1ef; align-items: center; font-size: .78rem; }
.top-row span { color: #6d7d74; }
.top-header { text-transform: uppercase; letter-spacing: .06em; color: #849089; font-size: .65rem; border-top: 0; }
.table-row > .product-cell { flex-direction: row; align-items: center; text-align: left; }
.product-cell .product-image { flex: 0 0 42px; }
.product-cell > span:last-child { align-items: flex-start; text-align: left; }
.muted-value { color: #8a9690; font-size: .72rem; }
.catalog-note b { color: #1f5138; }
input[type="file"] { background: white; padding: 10px; }
@media (max-width: 720px) {
  .bottom-nav a { font-size: .68rem; }
  .api-help { display: block; }
  .api-help b, .api-help span { display: block; }
  .api-help span { margin-top: 7px; }
  .store-actions { align-items: stretch; flex-direction: column; }
  .store-actions form .button, .store-actions > .button { width: 100%; }
  .head-actions { justify-content: flex-start; margin-top: 12px; }
  .analytics-grid { grid-template-columns: 1fr; }
  .analytics-kpis { grid-template-columns: 1fr 1fr; }
  .chart-bars { height: 230px; overflow: hidden; }
  .top-table { overflow-x: auto; }
  .top-row { min-width: 650px; }
  .bottom-nav a { min-width: 48px; }
}
