.detail-sections{display:grid;gap:24px}
.collapsible-panel{padding:0;overflow:hidden;scroll-margin-top:24px}
.collapsible-panel>.panel-summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 26px;cursor:pointer;user-select:none}
.collapsible-panel>.panel-summary::-webkit-details-marker{display:none}
.collapsible-panel>.panel-summary::marker{content:""}
.panel-summary-copy{display:block;min-width:0}
.panel-summary-copy .eyebrow{display:block;margin-bottom:8px}
.panel-summary-title{display:block;font-size:23px;line-height:1.15;letter-spacing:-.035em;font-weight:700;color:var(--ink)}
.panel-summary-description{display:block;margin-top:7px;color:var(--muted);font-size:14px;font-weight:400;letter-spacing:0}
.panel-toggle{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid #c8d9ce;border-radius:50%;background:#f7faf8;color:var(--green-dark);font-size:22px;font-weight:500;transition:transform .18s,background .18s}
.panel-toggle::before{content:"+"}
.collapsible-panel[open]>.panel-summary .panel-toggle::before{content:"−"}
.collapsible-panel>.panel-summary:hover .panel-toggle{background:var(--green-soft)}
.collapsible-panel>.panel-content{padding:0 26px 26px;border-top:1px solid #edf2ee}
.collapsible-panel[open]>.panel-content{padding-top:22px}
.detail-sections>.chart-panel{margin-top:0}
.featured-panel{border-color:#9bdab7;box-shadow:0 10px 30px rgba(16,87,52,.07)}
.featured-panel>.panel-summary{background:linear-gradient(135deg,#f3fcf6 0%,#ffffff 72%)}
.featured-panel .panel-summary-title{font-size:26px;color:#0c6d42}
.featured-panel .panel-toggle{background:var(--green-soft);border-color:#a9dfc0}
.comparison-intro{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:4px}
.comparison-intro p{margin:0;color:var(--muted);font-size:14px;max-width:760px}
.comparison-badge{flex-shrink:0;display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:var(--green-soft);color:var(--green-dark);font-size:12px;font-weight:750}
.comparison-controls{display:grid;gap:12px;padding:14px 16px;border:1px solid #dce9e0;border-radius:12px;background:#f8fbf9}
.comparison-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px}
.comparison-stores{gap:12px}
.comparison-stores label{padding:7px 9px;border:1px solid #dce6df;border-radius:8px;background:white;white-space:nowrap}
.comparison-difference-toggle{display:flex;align-items:center;gap:7px;flex:0 0 auto;font-size:13px;font-weight:650;color:var(--ink);cursor:pointer}
.comparison-difference-toggle input{width:16px;min-height:16px;height:16px;margin:0;accent-color:var(--green-dark)}
.comparison-selection-status{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:10px;border-top:1px solid #e4ece7;color:var(--muted);font-size:12px}
.comparison-selection-status strong{color:var(--green-dark);font-weight:750;white-space:nowrap}
.comparison-empty{margin-top:16px}
.featured-panel .table-wrap{margin-top:18px}
.featured-panel .comparison-table th:first-child{position:sticky;left:0;z-index:1}
.featured-panel .source-caption{margin:12px 0 0}
.collapsible-panel>.panel-summary:focus-visible{outline-offset:-4px;border-radius:var(--radius)}
.featured-panel .comparison-table thead th:first-child{z-index:3}
.featured-panel .comparison-table th:first-child{min-width:110px;width:160px;max-width:160px}
.offer-delta{display:block;margin-top:4px;font-size:11px;font-weight:650;line-height:1.3;color:#7d5416;letter-spacing:0}

@media(min-width:801px){
  .workspace>.filters-panel{position:sticky;top:18px;max-height:calc(100vh - 36px);overflow:auto;overscroll-behavior:contain}
}

@media(max-width:1120px){
  .collapsible-panel>.panel-summary{padding:20px}
  .collapsible-panel>.panel-content{padding:0 20px 20px}
  .collapsible-panel[open]>.panel-content{padding-top:20px}
}

@media(max-width:800px){
  .detail-sections{gap:18px}
  .comparison-intro{align-items:flex-start;flex-direction:column;gap:10px}
  .comparison-toolbar{align-items:stretch;flex-direction:column;gap:12px}
  .comparison-stores{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
  .comparison-stores label{flex:0 0 auto}
  .comparison-difference-toggle{align-self:flex-start}
  .comparison-selection-status{align-items:flex-start;flex-direction:column;gap:5px}
}

@media(max-width:540px){
  .featured-panel .comparison-table th:first-child{width:110px;max-width:110px}
  .collapsible-panel>.panel-summary{padding:18px 14px;gap:12px}
  .collapsible-panel>.panel-content{padding:0 14px 18px}
  .collapsible-panel[open]>.panel-content{padding-top:18px}
  .panel-summary-title{font-size:21px}
  .featured-panel .panel-summary-title{font-size:23px}
  .panel-summary-description{font-size:13px}
  .panel-toggle{flex-basis:34px;width:34px;height:34px}
  .comparison-controls{padding:12px}
}

/* Keep catalog history prices inside their own stat cards at every card width.
   The overlay acts as the sizing container so typography follows the card,
   not the viewport resolution. */
.professional-ui .catalog-history-card .catalog-history-overlay{
  container-type:inline-size;
}
.professional-ui .catalog-history-card:not(.catalog-list-row) .catalog-history-stats{
  gap:5px;
  gap:clamp(3px,1.6cqw,8px);
}
.professional-ui .catalog-history-card:not(.catalog-list-row) .catalog-history-stat{
  padding-inline:3px;
  padding-inline:clamp(2px,1.5cqw,7px);
}
.professional-ui .catalog-history-card:not(.catalog-list-row) .catalog-history-stat strong{
  font-size:11px;
  font-size:clamp(10px,5.2cqw,20px);
  line-height:1.1;
  letter-spacing:-.02em;
  white-space:nowrap;
  overflow-wrap:normal;
  word-break:normal;
}
