/* Piqelo page-width contract v1177 — owner directive, 12 October 2026.
   The native TV frame is 1760px including two 24px desktop gutters.
   Keep 88% of that frame and its visible content. Only outer canvases are sized;
   typography, native zoom, grids, cards and readable paragraph widths stay native. */
:root {
  --piqelo-page-max-width: 1548.8px; /* 1760px × 0.88 */
  --piqelo-page-width-ratio: 0.88;
  --piqelo-page-reference-gutter: 24px;
  --piqelo-page-reference-zoom: 1;
  --piqelo-page-native-zoom: 1;
  --piqelo-page-zoom-compensation: calc(var(--piqelo-page-reference-zoom) / var(--piqelo-page-native-zoom));
  --piqelo-page-content-max-width: calc((var(--piqelo-page-max-width) - 2 * var(--piqelo-page-reference-gutter) * var(--piqelo-page-width-ratio)) * var(--piqelo-page-zoom-compensation));
}
@media (min-width:1280px) and (max-width:1439px) { :root { --piqelo-page-reference-zoom: 1.03; } }
@media (min-width:1440px) and (max-width:1599px) { :root { --piqelo-page-reference-zoom: 1.10; } }
@media (min-width:1600px) { :root { --piqelo-page-reference-zoom: 1.15; } }
/* These pages retain the established TV/Laptop enlargement. Compensate their
   outer canvas only, so their visible edges match pages without body zoom. */
html:has(link[href*="category-desktop-scale-v934.css"], link[href*="tv-shell-bundle-v1067.css"], link[href*="laptop-shell-bundle-v1067.css"]) {
  --piqelo-page-native-zoom: var(--piqelo-page-reference-zoom);
}
html body > .platformShell,
html body.tvFinderShellV928 > .shell > main.main,
html body.laptopExperience > .shell > main.main,
html body.laptopExperience > .wrap,
html body[data-product-category="monitor"] > .shell,
html body > main.wrap,
html body > header.sitehead > .wrap,
html body > footer > .wrap,
html body.piqeloPolicyPage > main.policyWrap,
html body.piqeloPolicyPage > .policyHeader > .policyWrap,
html body.piqeloPolicyPage > .policyFooter > .policyWrap,
html body > .piqeloTrustFooter > .piqeloTrustFooterInner,
html body > .piqeloPageCanvas,
html body > .shell > .piqeloPageCanvas {
  box-sizing: border-box;
  width: calc(100% - 32px * var(--piqelo-page-zoom-compensation)) !important;
  max-width: var(--piqelo-page-content-max-width) !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  min-width: 0;
}
@media (min-width:1101px) {
  html body > .platformShell,
  html body.tvFinderShellV928 > .shell > main.main,
  html body.laptopExperience > .shell > main.main,
  html body.laptopExperience > .wrap,
  html body[data-product-category="monitor"] > .shell,
  html body > main.wrap,
  html body > header.sitehead > .wrap,
  html body > footer > .wrap,
  html body.piqeloPolicyPage > main.policyWrap,
  html body.piqeloPolicyPage > .policyHeader > .policyWrap,
  html body.piqeloPolicyPage > .policyFooter > .policyWrap,
  html body > .piqeloTrustFooter > .piqeloTrustFooterInner,
  html body > .piqeloPageCanvas,
  html body > .shell > .piqeloPageCanvas {
    width: calc((100% - 2 * var(--piqelo-page-reference-gutter) * var(--piqelo-page-zoom-compensation)) * var(--piqelo-page-width-ratio)) !important;
  }
}
/* The standalone Laptop wrap owns its canvas. Its nested main must not apply
   the old second 48px inset or a separate 1440px review maximum. */
html body.laptopExperience.piqeloLaptopReviewParity.piqeloFullReviewV1015 > .wrap > main {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}