.comparison-hero .lead{max-width:840px}
.comparison-toolbar{display:flex;justify-content:space-between;gap:1rem;align-items:center;flex-wrap:wrap;margin-bottom:1.25rem}
.comparison-toolbar p{color:var(--dim);font-size:.82rem;max-width:760px}
.comparison-actions{display:flex;gap:.6rem;flex-wrap:wrap}
.compact-toggle{border:1px solid var(--line);background:var(--bg2);color:var(--dim);font:500 .66rem var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:.65rem .85rem;cursor:pointer}
.compact-toggle:hover,.compact-toggle.active{color:var(--mint);border-color:var(--mint)}
.comparison-shell{position:relative;border:1px solid var(--line);background:var(--bg2);overflow:visible;box-shadow:0 28px 80px rgba(0,0,0,.26)}
.comparison-table{width:100%;min-width:0;table-layout:fixed;border-collapse:separate;border-spacing:0}
.comparison-table th,.comparison-table td{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:1rem .72rem;vertical-align:top;overflow-wrap:anywhere;word-break:normal}
.comparison-table th:last-child,.comparison-table td:last-child{border-right:0}
.comparison-table tr:last-child td{border-bottom:0}
.comparison-table thead th{position:static;background:rgba(13,15,28,.97);backdrop-filter:blur(14px);text-align:center;padding:1.15rem .7rem}
.comparison-table thead th:first-child{text-align:left;width:22%}
.comparison-table tbody th{position:static;background:#0d0f1c;text-align:left;width:22%}
.comparison-table .quanta-col{background:linear-gradient(180deg,rgba(124,140,255,.11),rgba(127,240,211,.035))}
.comparison-table thead .quanta-col{box-shadow:inset 0 3px 0 var(--mint)}
.product-head{display:flex;align-items:center;justify-content:center;gap:.7rem}
.product-head img{width:42px;height:42px;flex:0 0 auto}
.product-meta{text-align:left}
.product-meta strong{display:block;font:600 .92rem var(--display);color:var(--ink)}
.product-meta span{display:block;font:400 .6rem var(--mono);color:var(--dim);letter-spacing:.08em;text-transform:uppercase;margin-top:.15rem}
.dimension{display:flex;gap:.7rem;align-items:flex-start}
.dimension-index{font:500 .61rem var(--mono);color:var(--mint);padding-top:.15rem}
.dimension strong{font:500 .89rem var(--display);display:block}
.dimension small{display:block;color:var(--dim);font-size:.76rem;line-height:1.45;margin-top:.25rem}
.cell-main{display:block;color:var(--ink);font-size:.85rem;font-weight:500}
.cell-note{display:block;color:var(--dim);font-size:.73rem;line-height:1.42;margin-top:.28rem}
.status{display:inline-flex;align-items:center;gap:.38rem;font:500 .61rem var(--mono);letter-spacing:.06em;text-transform:uppercase;padding:.28rem .45rem;border-radius:999px;margin-bottom:.45rem;border:1px solid var(--line)}
.status::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.status-native{color:var(--mint);background:rgba(127,240,211,.06)}
.status-plan{color:#ffd67f;background:rgba(255,214,127,.05)}
.status-provider{color:#aeb7dd;background:rgba(174,183,221,.05)}
.status-limited{color:#ff9ba2;background:rgba(255,126,134,.05)}
.legend{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:1rem}
.legend .status{margin:0}
.comparison-note{margin-top:1.4rem;border:1px solid var(--line);background:var(--bg2);padding:1.15rem 1.25rem;color:var(--dim);font-size:.78rem}
.comparison-note strong{color:var(--ink)}
.source-list{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.source-item{background:var(--bg2);padding:1rem 1.1rem}
.source-item b{display:block;font:500 .75rem var(--mono);color:var(--mint);text-transform:uppercase;letter-spacing:.08em}
.source-item span{display:block;color:var(--dim);font-size:.78rem;margin-top:.3rem}
.comparison-table.compact th,.comparison-table.compact td{padding:.72rem .72rem}
.comparison-table.compact .cell-note,.comparison-table.compact .dimension small{display:none}
@media(max-width:760px){
  .source-list{grid-template-columns:1fr}
  .comparison-toolbar{align-items:flex-start}
}

/* Production comparison layout: the complete table remains visible without internal scrollbars. */
.comparison-table thead th:not(:first-child),
.comparison-table tbody td{width:15.6%;}
@media(max-width:1100px){
  .comparison-table th,.comparison-table td{padding:.72rem .45rem}
  .product-head{gap:.4rem;flex-direction:column}
  .product-head img{width:32px;height:32px}
  .product-meta{text-align:center}
  .product-meta strong{font-size:.76rem}
  .product-meta span,.status{font-size:.52rem}
  .dimension{gap:.38rem}
  .dimension strong{font-size:.72rem}
  .dimension small,.cell-note{font-size:.62rem}
  .cell-main{font-size:.7rem}
}
@media(max-width:700px){
  .comparison-toolbar{display:block}
  .comparison-actions{margin-top:.8rem}
  .comparison-table th,.comparison-table td{padding:.48rem .25rem}
  .comparison-table thead th:first-child,.comparison-table tbody th{width:20%}
  .comparison-table thead th:not(:first-child),.comparison-table tbody td{width:16%}
  .product-head img{width:24px;height:24px}
  .product-meta strong{font-size:.61rem}
  .product-meta span{font-size:.43rem}
  .dimension-index{display:none}
  .dimension strong{font-size:.58rem}
  .dimension small,.cell-note{font-size:.5rem;line-height:1.3}
  .cell-main{font-size:.57rem}
  .status{font-size:.43rem;padding:.2rem .26rem}
}