:root{color-scheme:light;--ink:#172c27;--muted:#75817b;--green:#1f7057;--line:#dfe6df;--paper:#f5f7f2}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:13px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit;text-decoration:none}button,select,input{font:inherit}button,a,select{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #327f65;outline-offset:3px}header{display:flex;align-items:center;gap:35px;padding:22px 4.5%;border-bottom:1px solid var(--line);background:#fff}.brand{display:flex;gap:12px;align-items:center;font-weight:650;font-size:15px;line-height:1.3}.logo{font-size:34px;width:42px;height:42px;text-align:center;background:#245d49;border-radius:12px;color:white}.brand small{display:block;font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:5px}header nav{display:flex;gap:28px;margin-left:auto;color:#64716a;font-size:11px}.badge{font-size:9px;padding:6px 12px;background:#edf3e8;border:1px solid #d8e2d0;border-radius:20px;color:#506846}main{max-width:1560px;margin:auto;padding:42px 4.5% 20px}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:34px}.eyebrow{font-size:9px;letter-spacing:2px;color:#72816b}h1{font-size:54px;font-weight:500;line-height:1.08;letter-spacing:-2.4px;margin:18px 0}h1 em{font-family:Georgia,serif;color:var(--green);font-weight:400}.heading p{color:var(--muted);font-size:13px}.scan-box{border-left:1px solid #d3ddd0;padding:10px 0 10px 24px;display:flex;flex-direction:column;position:relative;font-size:11px;color:var(--muted);max-width:290px}.scan-box strong{color:var(--ink);font-weight:500}.scan-box time{margin:7px 0}.scan-box a{margin-top:12px;color:var(--green)}.pulse{width:6px;height:6px;background:#3d8969;border-radius:50%;position:absolute;left:10px;top:18px}#warning:not(:empty){padding:12px 17px;background:#fff4dc;border:1px solid #eadbb5;border-radius:8px;color:#7d622b;font-size:11px;margin-bottom:20px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:30px}.metric{border:1px solid var(--line);background:white;padding:19px 22px;border-radius:10px}.metric small{display:block;color:#879087;font-size:10px}.metric strong{font-size:31px;font-weight:500;letter-spacing:-1px;display:block;margin:6px 0 1px}.metric .positive{color:var(--green)}.metric span{font-size:9px;color:#7d8a7d}.panel{border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}.panel-heading{padding:25px 25px 14px;display:flex;align-items:center;justify-content:space-between}.panel-heading>span,.section-top>span{font-size:10px;color:var(--muted)}h2{font-size:22px;letter-spacing:-.6px;font-weight:500;margin:4px 0 0}.filters{display:flex;flex-wrap:wrap;gap:10px;padding:9px 25px 22px;align-items:flex-end}label{font-size:9px;color:#7e887f;display:flex;flex-direction:column;gap:5px}select,input{height:35px;padding:7px 11px;border:1px solid var(--line);border-radius:5px;background:#fafbf8;color:#415349;font-size:10px;max-width:170px}input{width:75px}.reset{height:35px;border:0;background:none;color:#718075;font-size:10px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left;font-size:11px}th{background:#f6f8f3;color:#7b897f;font-size:8px;font-weight:500;letter-spacing:.5px;padding:12px 17px;border-block:1px solid var(--line)}td{padding:16px 17px;border-bottom:1px solid #eef1eb}td small{display:block;color:#8d958f;font-size:9px;max-width:160px;overflow:hidden;text-overflow:ellipsis}td .model-btn{padding:0;background:none;border:0;font-weight:600;font-size:11px;color:var(--ink);text-align:left}td .model-btn:hover{color:var(--green)}.money{font-size:15px;font-weight:600;letter-spacing:-.4px}.subtle{color:#8d958f}.pill{font-size:8px;padding:3px 7px;border-radius:4px;background:#edf5ed;color:#45815c}.pill.warn{color:#9b7636;background:#faf2df}.negative{color:#298064}.increase{color:#a05a49}.table-note{font-size:9px;color:#8c958e;padding:12px 25px;margin:0;line-height:1.9}.empty{padding:30px;text-align:center;color:#829081}#deals{margin:34px 0}.section-top{display:flex;justify-content:space-between;align-items:end;margin-bottom:16px}.deal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:12px}.deal{padding:22px;border:1px solid #d6e3d5;border-radius:10px;background:#fff}.deal h3{font-weight:500;margin:5px 0}.deal strong{font-size:24px;color:var(--green)}.deal a{display:block;font-size:11px;color:var(--green);margin-top:10px}.store-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;padding:6px 25px 18px}.store{border:1px solid var(--line);border-radius:8px;padding:17px}.store h3{font-size:12px;margin:0 0 8px}.store p{font-size:10px;color:#768379;margin:6px 0}.store details{font-size:9px;color:#92734b;overflow-wrap:anywhere}footer{display:flex;gap:22px;flex-wrap:wrap;padding:30px 0 0;font-size:9px;color:#8a958c}footer strong{margin-right:auto;color:#506556}dialog{width:min(900px,94vw);max-height:90vh;border:1px solid #d8e1d5;border-radius:15px;padding:30px;color:var(--ink);box-shadow:0 20px 80px #172c2730}dialog::backdrop{background:#12291f66;backdrop-filter:blur(3px)}#close{position:absolute;right:18px;top:12px;font-size:24px;border:0;background:none;color:#8b958d}.chart-label{flex-direction:row;align-items:center;justify-content:space-between;margin-top:25px;font-size:13px}#chart{margin-top:15px;overflow-x:auto}#chart svg{width:100%;height:auto;display:block}#chart-note{font-size:10px;color:#7f8a80}#series{display:flex;flex-wrap:wrap;gap:13px;margin-top:15px}#series label{flex-direction:row;align-items:center}#series input{width:13px;height:13px}.detail-offer{display:flex;gap:20px;align-items:center;border-top:1px solid #e4e9e0;padding:12px 0}.detail-offer a{margin-left:auto;color:var(--green)}.detail-offer small{color:#8d958f}.data-error{padding:30px;background:#fff4dc}@media(max-width:1000px){header nav{gap:14px}.badge{display:none}h1{font-size:46px}.metrics{gap:8px}.metric{padding:16px}.filters{gap:7px}}@media(max-width:650px){header{padding:16px 5%;flex-wrap:wrap;gap:15px}header nav{margin:0;gap:20px;font-size:10px}.brand{font-size:13px}main{padding:25px 5%}h1{font-size:39px}.heading{display:block}.scan-box{margin-top:25px}.metrics{grid-template-columns:repeat(2,1fr)}.metric strong{font-size:27px}.panel-heading{padding:19px 16px 10px}.filters{padding:9px 16px 18px}select{max-width:145px}.section-top{display:block}.section-top>span{display:block;margin-top:7px}.store-grid{padding-inline:16px}.detail-offer{flex-wrap:wrap;gap:10px}.detail-offer a{margin-left:0}.eyebrow{font-size:8px;letter-spacing:1.4px}}

/* Larger type and controls throughout the dashboard. */
body{font-size:16px;line-height:1.55}
header{padding:24px 3%}.brand{font-size:19px}.brand small,.badge{font-size:12px}header nav{font-size:14px}
main{max-width:1860px;padding:44px 3% 26px}
.eyebrow{font-size:12px}.heading p{font-size:17px}h1{font-size:clamp(44px,5vw,76px)}h2{font-size:29px}
.scan-box{font-size:14px;max-width:350px}#warning:not(:empty){font-size:14px}
.metric{padding:23px 25px}.metric small{font-size:14px}.metric strong{font-size:39px}.metric span{font-size:12px}
.panel-heading>span,.section-top>span{font-size:13px}
.filters{gap:14px}label{font-size:13px}select,input,.reset{font-size:14px;height:42px}select{max-width:220px}
table{font-size:14px}th{font-size:12px}td{padding-block:19px}td small{font-size:12px;max-width:230px}td .model-btn{font-size:15px}
.money{font-size:20px}.pill{font-size:11px}.table-note{font-size:13px}
.deal a,.store h3,.chart-label{font-size:16px}.store p,.store details,#chart-note,footer{font-size:13px}
#series label{font-size:13px}#chart svg{min-width:540px}
@media(max-width:650px){header{padding:18px 5%}main{padding:26px 5%}.brand{font-size:17px}header nav{font-size:13px}
h1{font-size:43px}h2{font-size:25px}.metric{padding:15px}.metric strong{font-size:32px}.metric small{font-size:12px}
.filters{gap:10px}select{max-width:175px}.heading p{font-size:15px}}

/* Phone layout: keep comparison details visible without a sideways scroll. */
@media (max-width: 760px) {
  header { padding: 12px 16px; display: grid; gap: 6px; }
  header nav { margin: 0; flex-wrap: wrap; gap: 0 16px; }
  header nav a { display: inline-flex; align-items: center; min-height: 44px; }
  header nav a[hidden] { display: none; }
  main { padding: 22px 12px; }
  .heading { display: block; margin-bottom: 20px; }
  h1 { font-size: clamp(31px, 8vw, 52px); letter-spacing: -.04em; }
  .scan-box { max-width: none; margin-top: 18px; }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 20px; }
  .metric { min-width: 0; padding: 12px; overflow-wrap: anywhere; }
  .metric strong { font-size: 30px; }
  .panel-heading { display: grid; gap: 4px; padding: 16px 12px 10px; }
  .filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 8px 12px 16px; }
  .filters label { min-width: 0; color: #536259; }
  .filters select, .filters input, .chart-label select { max-width: none; width: 100%; min-width: 0; min-height: 44px; font-size: 16px; }
  .filters .reset { grid-column: 1 / -1; min-height: 44px; border: 1px solid var(--line); border-radius: 6px; color: var(--green); }
  .table-wrap { padding: 8px 10px 12px; overflow: visible; background: var(--paper); }
  .table-wrap table, .table-wrap tbody { display: block; white-space: normal; }
  .table-wrap thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .table-wrap tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; margin-bottom: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 9px; background: white; }
  .table-wrap td { min-width: 0; padding: 0; border: 0; overflow-wrap: anywhere; }
  .table-wrap td small { max-width: none; color: #64716a; }
  .table-wrap td::before { display: block; color: #64716a; font-size: 11px; line-height: 1.3; margin-bottom: 3px; }
  .table-wrap td:nth-child(1) { order: -4; }
  .table-wrap td:nth-child(3) { order: -3; text-align: right; }
  .table-wrap td:nth-child(2) { order: -2; }
  .table-wrap td:nth-child(8) { order: -1; }
  .table-wrap td:nth-child(2)::before { content: "Магазин / продавец"; }
  .table-wrap td:nth-child(4)::before { content: "Заявленная старая цена"; }
  .table-wrap td:nth-child(5)::before { content: "Изменение цены"; }
  .table-wrap td:nth-child(6)::before { content: "Минимум за 30 дней"; }
  .table-wrap td:nth-child(7)::before { content: "Срок акции"; }
  .table-wrap td:nth-child(9)::before { content: "Дата проверки"; }
  .table-wrap td:nth-child(10), .table-wrap td.empty { grid-column: 1 / -1; }
  .table-wrap td.empty { padding: 12px; }
  .table-wrap td .model-btn { min-height: 44px; font-size: 16px; text-decoration: underline; text-underline-offset: 3px; }
  .table-wrap .money { display: inline-block; padding-top: 5px; font-size: clamp(17px, 5vw, 24px); }
  .table-wrap td:last-child a { display: grid; place-items: center; min-height: 44px; background: #edf5ed; border-radius: 6px; color: var(--green); font-weight: 600; }
  .pill { display: inline-block; white-space: normal; }
  .table-note { padding: 10px 12px; line-height: 1.55; }
  .deal-grid, .store-grid { grid-template-columns: minmax(0, 1fr); }
  dialog { width: calc(100% - 20px); max-width: none; max-height: calc(100dvh - 24px); padding: 52px 14px 16px; overflow-wrap: anywhere; }
  #close { top: 5px; right: 6px; min-width: 44px; min-height: 44px; }
  .chart-label { gap: 10px; }
  .chart-label select { width: auto; max-width: 58%; }
  #chart svg { min-width: 480px; }
  #series label { min-height: 44px; }
  .detail-offer { flex-wrap: wrap; gap: 8px; }
  .detail-offer a { margin-left: 0; width: 100%; min-height: 44px; display: flex; align-items: center; }
  footer { gap: 12px 20px; }
}