.buybox-page {
  width: min(1536px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 20px;
  color: #2d1711;
  font-family: Poppins, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.top-nav-item.buybox-nav-item { position: relative; overflow: visible; }
.top-nav-item.buybox-nav-item>button { position: relative; overflow: visible; }
.top-nav-item.buybox-nav-item>button>svg { width: 17px; height: 17px; flex: 0 0 17px; padding: 0; border-radius: 0; background: transparent; color: currentColor; stroke-width: 2; filter: none; box-shadow: none; }
.top-nav-item.buybox-nav-item>button.active>svg { background: transparent; box-shadow: none; }
.buybox-new-badge { position: absolute; z-index: 12; top: -12px; right: 5px; min-width: 32px; height: 18px; display: inline-flex; align-items: center; justify-content: center; padding: 0 7px; border: 2px solid #fff; border-radius: 999px; background: #e52f2f; color: #fff !important; font-size: 8px !important; line-height: 1 !important; font-weight: 900 !important; letter-spacing: .02em; text-transform: uppercase; box-shadow: 0 4px 10px rgba(204,28,28,.34); pointer-events: none; animation: buybox-new-pulse 1.35s ease-in-out infinite; }
@keyframes buybox-new-pulse {
  0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 4px 10px rgba(204,28,28,.34), 0 0 0 0 rgba(229,47,47,.36); }
  50% { opacity: .48; transform: scale(.93); box-shadow: 0 3px 7px rgba(204,28,28,.2), 0 0 0 6px rgba(229,47,47,0); }
}
@media (prefers-reduced-motion: reduce) {
  .buybox-new-badge { animation: none; }
}

.buybox-hero {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 14px 18px;
  border: 1px solid #dbe9ec;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 3px 14px rgba(9, 86, 106, .08);
}
.buybox-hero h1 { margin: 0; color: #a44a36; font-size: 17px; line-height: 1.2; }
.buybox-hero p { max-width: 780px; margin: 5px 0 0; color: #75645f; font-size: 11px; line-height: 1.45; }
.buybox-hero-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.buybox-source { display: grid; gap: 2px; padding: 7px 11px; border-radius: 9px; background: #eef9f3; color: #147343; }
.buybox-source b { font-size: 10px; }
.buybox-source small { color: #668076; font-size: 9px; white-space: nowrap; }
.buybox-refresh,
.buybox-panel-head button {
  min-height: 36px;
  border: 0;
  border-radius: 9px;
  padding: 0 14px;
  background: #12c857;
  color: #07341b;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(18, 200, 87, .2);
}
.buybox-refresh:disabled { opacity: .55; cursor: wait; box-shadow: none; }
.buybox-message { padding: 10px 14px; border: 1px solid #9fdbea; border-radius: 10px; background: #eefaff; color: #075b70; font-size: 11px; font-weight: 700; }

.buybox-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.buybox-summary-card {
  --card-accent: #24a85a;
  --card-soft: rgba(36,168,90,.12);
  --card-text: #08733b;
  position: relative;
  min-height: 148px;
  display: grid;
  align-content: start;
  gap: 7px;
  overflow: hidden;
  padding: 16px 17px 14px;
  border: 1px solid color-mix(in srgb, var(--card-accent) 19%, #e7eef0);
  border-radius: 17px;
  background: linear-gradient(145deg, #fff 18%, color-mix(in srgb, var(--card-soft) 45%, #fff));
  box-shadow: 0 9px 25px rgba(21,57,64,.09), inset 0 1px 0 rgba(255,255,255,.88);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.buybox-summary-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--card-accent) 36%, #dfe9eb); box-shadow: 0 14px 30px rgba(21,57,64,.14); }
.buybox-summary-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, var(--card-accent), color-mix(in srgb, var(--card-accent) 35%, #fff)); }
.buybox-summary-card::after { content: ""; position: absolute; right: 0; top: 0; width: 82px; height: 82px; border-radius: 0 17px 0 100%; background: var(--card-soft); }
.buybox-summary-head { position: relative; z-index: 1; display: grid; grid-template-columns: 31px minmax(0,1fr) auto; align-items: center; gap: 8px; }
.buybox-summary-icon { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--card-accent) 24%, #fff); border-radius: 10px; background: color-mix(in srgb, var(--card-soft) 65%, #fff); color: var(--card-text); font-size: 15px; font-weight: 900; box-shadow: inset 0 1px 0 rgba(255,255,255,.85); }
.buybox-summary-label { color: #58433d; font-size: 11px; line-height: 1.25; font-weight: 800; }
.buybox-summary-head>em { min-height: 27px; display: inline-flex; align-items: center; justify-self: end; padding: 5px 10px; border: 1px solid color-mix(in srgb, var(--card-accent) 28%, #fff); border-radius: 999px; background: color-mix(in srgb, var(--card-soft) 76%, #fff); color: var(--card-text); font-size: 10px; line-height: 1; letter-spacing: -.015em; font-style: normal; font-weight: 900; white-space: nowrap; box-shadow: 0 4px 10px color-mix(in srgb, var(--card-soft) 74%, transparent), inset 0 1px 0 rgba(255,255,255,.9); }
.buybox-summary-card>strong { position: relative; z-index: 1; color: var(--card-text); font-size: 32px; line-height: 1; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.buybox-summary-card>small { position: relative; z-index: 1; min-height: 14px; color: #806f69; font-size: 8.5px; line-height: 1.4; font-weight: 600; }
.buybox-summary-progress { position: relative; z-index: 1; height: 5px; overflow: hidden; margin-top: 2px; border-radius: 999px; background: rgba(116,137,142,.14); }
.buybox-summary-progress>i { display: block; min-width: 3px; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--card-accent), color-mix(in srgb, var(--card-accent) 55%, #fff)); box-shadow: 0 0 9px var(--card-soft); transition: width .4s ease; }
.buybox-summary-card.losing { --card-accent: #f35b47; --card-soft: rgba(243,91,71,.13); --card-text: #cf3d2d; }
.buybox-summary-card.competitive { --card-accent: #ed981b; --card-soft: rgba(237,152,27,.14); --card-text: #a86408; }
.buybox-summary-card.rate { --card-accent: #1389a5; --card-soft: rgba(19,137,165,.13); --card-text: #07677d; }

.buybox-panel { min-width: 0; overflow: hidden; border: 1px solid #d4e7eb; border-radius: 13px; background: #fff; box-shadow: 0 5px 20px rgba(7, 81, 99, .08); }
.buybox-panel-head { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 9px 13px; background: linear-gradient(135deg, #08788d, #07596d); color: #fff; }
.buybox-panel-head h2 { margin: 0; font-size: 13px; }
.buybox-panel-head>div { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.buybox-panel-head input,
.buybox-panel-head select {
  height: 34px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 8px;
  background: rgba(255,255,255,.98);
  padding: 0 10px;
  color: #27444a;
  font: inherit;
  font-size: 10px;
  font-weight: 600;
}
.buybox-panel-head input { width: 245px; }
.buybox-panel-head select { min-width: 145px; }
.buybox-panel-head input:focus,
.buybox-panel-head select:focus { outline: 3px solid rgba(91,217,239,.4); }

.buybox-table-wrap { max-height: 70vh; overflow: auto; scrollbar-gutter: stable; }
.buybox-table { width: 100%; min-width: 1440px; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 11px; }
.buybox-table th {
  position: sticky;
  top: 0;
  z-index: 5;
  height: 48px;
  padding: 8px 11px;
  border-right: 1px solid #ffc1b4;
  border-bottom: 1px solid #ffad9b;
  background: #ffe1da;
  color: #3e211b;
  font-size: 10px;
  text-align: left;
  white-space: nowrap;
}
.buybox-table td { min-height: 88px; padding: 12px 14px; border-right: 1px solid #f0ded9; border-bottom: 1px solid #f0ded9; vertical-align: middle; background: #fff; }
.buybox-table tbody tr:hover td { background: #fffaf8; }
.buybox-table th:nth-child(1),
.buybox-table td:nth-child(1) { width: 450px; min-width: 450px; max-width: 450px; position: sticky; left: 0; }
.buybox-table th:nth-child(1) { z-index: 7; }
.buybox-table td:nth-child(1) { z-index: 3; box-shadow: 5px 0 9px rgba(87, 51, 42, .04); }
.buybox-table th:nth-child(2),
.buybox-table td:nth-child(2),
.buybox-table th:nth-child(3),
.buybox-table td:nth-child(3) { width: 210px; }
.buybox-table th:nth-child(4),
.buybox-table td:nth-child(4) { width: 80px; text-align: center; }
.buybox-table th:nth-child(5),
.buybox-table td:nth-child(5) { width: 155px; text-align: center; }
.buybox-table th:nth-child(6),
.buybox-table td:nth-child(6) { width: 300px; }
.buybox-empty { height: 190px; color: #7e6b66; font-size: 12px; font-weight: 700; text-align: center; }

.buybox-product-cell>div { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 14px; align-items: center; }
.buybox-product-cell img,
.buybox-image-empty { width: 74px; height: 86px; border: 1px solid #e5dcd8; border-radius: 9px; background: #f5f2f0; object-fit: cover; }
.buybox-product-cell img { transition: transform .18s ease, box-shadow .18s ease; transform-origin: left center; }
.buybox-product-cell img:hover { position: relative; z-index: 20; transform: scale(2.1); box-shadow: 0 10px 30px rgba(45,23,17,.28); }
.buybox-image-empty { display: grid; place-items: center; color: #9b8e89; font-size: 8px; text-align: center; }
.buybox-product-cell>div>span { min-width: 0; display: grid; gap: 4px; }
.buybox-product-cell b { display: block; overflow: visible; color: #3e211a; font-size: 12.5px; line-height: 1.38; font-weight: 750; white-space: normal; overflow-wrap: anywhere; }
.buybox-product-cell small { overflow: visible; color: #806e68; font-size: 9px; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; }
.buybox-product-cell em { justify-self: start; margin-top: 2px; padding: 3px 6px; border-radius: 999px; font-size: 7.5px; font-style: normal; font-weight: 800; }
.buybox-product-cell em.verified { background: #e4f8ea; color: #147241; }
.buybox-product-cell em.stale { background: #fff0d5; color: #a46607; }

.buybox-price-cell { display: grid; gap: 9px; justify-items: start; }
.buybox-price-cell>strong { color: #f0523d; font-size: 17px; line-height: 1.1; font-weight: 850; letter-spacing: -.02em; }
.buybox-profit { display: grid; gap: 2px; min-width: 104px; padding: 8px 10px; border-radius: 9px; background: #e5f7ea; color: #11743e; box-shadow: inset 0 0 0 1px rgba(17,116,62,.07); }
.buybox-profit b { font-size: 12.5px; line-height: 1.1; }
.buybox-profit small { font-size: 9px; font-weight: 750; }
.buybox-profit.loss { background: #ffeae6; color: #d93f2f; }
.buybox-profit.incomplete { max-width: 185px; background: #fff4d9; color: #9b650c; white-space: normal; }
.buybox-next-prices { color: #897873; font-size: 8.5px; font-weight: 600; }
.buybox-rank { color: #0b7287; font-size: 15px; font-weight: 900; }
.buybox-status { display: inline-flex; min-height: 27px; align-items: center; justify-content: center; padding: 5px 9px; border-radius: 999px; font-size: 8.5px; font-weight: 900; white-space: nowrap; }
.buybox-status.winning { background: #dcf8e4; color: #08723b; }
.buybox-status.losing { background: #ffe5df; color: #cf3828; }
.buybox-status.single_seller { background: #e9f4f7; color: #17677a; }
.buybox-status.unknown { background: #fff1d5; color: #94600a; }

.buybox-manual { display: grid; gap: 6px; }
.buybox-manual>div { display: flex; align-items: center; gap: 6px; }
.buybox-manual input { width: 120px; height: 32px; border: 1px solid #d8ceca; border-radius: 7px; padding: 0 8px; font: inherit; font-size: 10px; font-weight: 700; }
.buybox-manual button { min-height: 32px; border: 0; border-radius: 7px; padding: 0 9px; background: #3a1b14; color: #ff8568; font: inherit; font-size: 8.5px; font-weight: 800; cursor: pointer; }
.buybox-manual button:disabled { opacity: .55; cursor: wait; }
.buybox-manual>small { color: #988984; font-size: 7.5px; line-height: 1.35; }
.buybox-manual .buybox-simulation { align-items: center; justify-content: space-between; }
.buybox-manual .buybox-save-price,
.buybox-manual .buybox-open-result { background: #0b788e; color: #fff; }
.buybox-footer { min-height: 52px; display: flex; align-items: center; gap: 22px; padding: 10px 14px; border-top: 3px solid #08788d; background: #eef9fb; color: #526d73; font-size: 9px; font-weight: 600; }

html:has(.buybox-modal-backdrop),
body:has(.buybox-modal-backdrop) {
  overflow: hidden !important;
}
.buybox-modal-backdrop {
  position: fixed;
  inset: 0 !important;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100vw;
  height: 100dvh;
  min-width: 100vw;
  min-height: 100dvh;
  box-sizing: border-box;
  overflow: hidden;
  overscroll-behavior: contain;
  margin: 0;
  padding: 24px;
  background: rgba(24, 37, 41, .66);
  backdrop-filter: blur(7px);
  animation: buybox-backdrop-in .18s ease-out both;
}
.buybox-modal {
  position: relative;
  inset: auto;
  width: min(760px, calc(100vw - 48px));
  max-width: calc(100vw - 48px);
  height: auto;
  max-height: min(760px, calc(100dvh - 48px));
  min-height: 0;
  margin: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  overflow: hidden;
  overscroll-behavior: contain;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 30px 90px rgba(0, 25, 31, .36);
  animation: buybox-modal-in .22s ease-out both;
}
.buybox-modal>header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 24px 17px;
  border-bottom: 1px solid #e4eef0;
  background: linear-gradient(135deg, #f8fdfe, #fff);
}
.buybox-modal-eyebrow { color: #ff654f; font-size: 9px; font-weight: 900; letter-spacing: .13em; }
.buybox-modal h2 { margin: 4px 0 0; color: #2d1711; font-size: 21px; line-height: 1.2; }
.buybox-modal-close { width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 11px; background: #361912; color: #fff; font-size: 25px; line-height: 1; cursor: pointer; }
.buybox-modal-close:disabled { opacity: .45; cursor: wait; }
.buybox-modal-product { display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: center; gap: 13px; padding: 14px 24px; border-bottom: 1px solid #edf2f3; background: #fbfdfd; }
.buybox-modal-product img,
.buybox-modal-product>span { width: 58px; height: 66px; border: 1px solid #e3dedb; border-radius: 9px; background: #f4f1ef; object-fit: cover; }
.buybox-modal-product>span { display: grid; place-items: center; color: #8d7b75; font-size: 8px; text-align: center; }
.buybox-modal-product>div { min-width: 0; display: grid; gap: 3px; }
.buybox-modal-product strong { color: #452820; font-size: 12px; line-height: 1.35; }
.buybox-modal-product small { color: #887670; font-size: 9px; }
.buybox-modal-content { min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; padding: 22px 24px; }
.buybox-modal-result { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.buybox-modal-result>div { min-height: 105px; display: grid; align-content: center; gap: 5px; padding: 16px 18px; border: 1px solid #dcecef; border-radius: 14px; background: #f6fbfc; }
.buybox-modal-result span { color: #708287; font-size: 10px; font-weight: 700; }
.buybox-modal-result strong { color: #095e72; font-size: 25px; line-height: 1.1; }
.buybox-modal-result small { color: #16824b; font-size: 10px; font-weight: 800; }
.buybox-modal-result.profit>div:last-child { border-color: #bfe7ca; background: #eefaf1; }
.buybox-modal-result.profit>div:last-child strong { color: #0b7b40; }
.buybox-modal-result.loss>div:last-child { border-color: #ffc9c0; background: #fff1ee; }
.buybox-modal-result.loss>div:last-child strong,
.buybox-modal-result.loss>div:last-child small { color: #d93f2f; }
.buybox-modal-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 14px; }
.buybox-modal-metrics>div { display: grid; gap: 4px; padding: 11px 12px; border: 1px solid #e3edef; border-radius: 10px; background: #fff; }
.buybox-modal-metrics span { color: #7b8a8e; font-size: 9px; }
.buybox-modal-metrics b { color: #3b2722; font-size: 12px; }
.buybox-modal-notice { margin-top: 16px; padding: 13px 15px; border: 1px solid #a9ddea; border-radius: 11px; background: #effaff; color: #075d72; }
.buybox-modal-notice b { font-size: 10px; }
.buybox-modal-notice p { margin: 4px 0 0; font-size: 9px; line-height: 1.45; }
.buybox-modal-notice.danger { border-color: #ffb6aa; background: #fff0ed; color: #a93627; }
.buybox-modal-missing { padding: 18px; border: 1px solid #f0ce8a; border-radius: 12px; background: #fff8e8; color: #8a5a09; }
.buybox-modal-missing strong { font-size: 13px; }
.buybox-modal-missing p { margin: 6px 0 0; font-size: 10px; line-height: 1.45; }
.buybox-modal-state { min-height: 250px; display: grid; place-items: center; align-content: center; gap: 9px; padding: 30px; text-align: center; }
.buybox-modal-state h3 { margin: 4px 0 0; color: #34201b; font-size: 17px; }
.buybox-modal-state p { max-width: 520px; margin: 0; color: #68777a; font-size: 10px; line-height: 1.55; }
.buybox-modal-state small { color: #8a999c; font-size: 9px; }
.buybox-modal-state-icon { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; background: #e5f8eb; color: #0b8243; font-size: 28px; font-weight: 900; }
.buybox-modal-state.error .buybox-modal-state-icon { background: #ffebe7; color: #d74232; }
.buybox-modal-spinner { width: 48px; height: 48px; border: 5px solid #d9edf1; border-top-color: #08788d; border-radius: 50%; animation: buybox-spin .8s linear infinite; }
.buybox-modal>footer { display: flex; align-items: center; justify-content: flex-end; gap: 9px; padding: 15px 24px 20px; border-top: 1px solid #e5edef; background: #fbfdfd; }
.buybox-modal>footer button { min-height: 39px; border: 0; border-radius: 9px; padding: 0 15px; font: inherit; font-size: 10px; font-weight: 850; cursor: pointer; }
.buybox-modal-secondary { border: 1px solid #d9e3e5 !important; background: #fff; color: #53666a; }
.buybox-modal-primary { background: #0b788e; color: #fff; box-shadow: 0 5px 15px rgba(11,120,142,.22); }
.buybox-modal-danger { background: #ed503c; color: #fff; box-shadow: 0 5px 15px rgba(237,80,60,.22); }
@keyframes buybox-spin { to { transform: rotate(360deg); } }
@keyframes buybox-backdrop-in { from { opacity: 0; } }
@keyframes buybox-modal-in { from { opacity: 0; transform: translateY(12px) scale(.97); } }

@media (max-width: 1100px) {
  .buybox-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .buybox-panel-head { align-items: flex-start; flex-direction: column; }
  .buybox-panel-head>div { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
}
@media (max-width: 720px) {
  .buybox-hero { align-items: flex-start; flex-direction: column; }
  .buybox-hero-actions { width: 100%; align-items: stretch; flex-direction: column; }
  .buybox-summary-grid { grid-template-columns: 1fr; }
  .buybox-panel-head input { width: 100%; }
  .buybox-panel-head select { flex: 1; }
  .buybox-modal-backdrop { padding: 10px; }
  .buybox-modal { width: calc(100vw - 20px); max-width: calc(100vw - 20px); max-height: calc(100dvh - 20px); }
  .buybox-modal-result { grid-template-columns: 1fr; }
  .buybox-modal-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .buybox-modal>footer { align-items: stretch; flex-direction: column-reverse; }
  .buybox-modal>footer button { width: 100%; }
}