/* Light edge rail. Product images keep their native dimensions and scale. */
:root{--gnn-accent:#f45127;--gnn-tint:#fff}
.gnn-card{position:relative}
.gnn-media{display:block;width:100%;min-width:0;color:#222832;font-family:var(--gna-font,system-ui);text-align:center}
.gnn-visual{display:flow-root;min-width:0;min-height:calc(78px + var(--gnn-count,1)*46px + var(--gnn-long,0)*12px)}
.gnn-packshot{display:flow-root;width:100%;min-width:0}
.gnn-rail{position:absolute;top:54px;left:0;right:auto;z-index:4;width:76px;max-width:50%;box-sizing:border-box;border:1px solid #e1e5ea;border-left:0;border-radius:0 12px 12px 0;background:#fffffff5;background:color-mix(in srgb,var(--gnn-tint) 6%,#fffffff5);color:#222832;box-shadow:4px 4px 15px #18203112;font-family:var(--gna-font,system-ui);text-align:center;line-height:1.2;overflow:hidden}
.gnn-rail:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#ff8a24,var(--gnn-accent),#ed2444);pointer-events:none}
.gnn-rail[data-side=right]{left:auto;right:0;border-left:1px solid #e1e5ea;border-right:0;border-radius:12px 0 0 12px}
.gnn-rail [hidden],.gnn-rail[hidden]{display:none!important}
.gnn-rail .gnn-toggle{display:flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;width:100%;min-width:0;height:44px;min-height:44px;margin:0;padding:6px;border:0;border-radius:0;background:transparent;color:#9b3520;box-shadow:none;cursor:pointer;touch-action:manipulation;appearance:none}
.gnn-rail .gnn-toggle:hover{background:#fff0e8;color:#c33427}
.gnn-rail .gnn-toggle:focus-visible{outline:2px solid #ce4427;outline-offset:-4px}
.gnn-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.gnn-toggle .gnn-toggle-chevron{width:12px;height:12px;transition:transform .18s ease}
.gnn-rail[data-side=right] .gnn-toggle-chevron{transform:rotate(180deg)}
.gnn-rail.is-collapsed{width:44px}
.gnn-rail.is-collapsed .gnn-toggle{gap:2px;padding:4px}
.gnn-rail.is-collapsed .gnn-toggle-chevron{transform:rotate(180deg)}
.gnn-rail.is-collapsed[data-side=right] .gnn-toggle-chevron{transform:none}
.gnn-metrics{display:flex;flex-direction:column;width:100%;min-width:0}
.gnn-metric{display:grid;grid-template-columns:12px minmax(0,1fr);align-content:center;align-items:center;gap:3px;min-width:0;box-sizing:border-box;height:46px;padding:5px 6px;border:0;border-top:1px solid #e9ecf0;background:transparent;color:#222832;line-height:1.15}
.gnn-metric-icon{display:flex;color:var(--gnn-accent)}
.gnn-metric:nth-child(even) .gnn-metric-icon{color:#e34536}
.gnn-metric svg{width:12px;height:12px}
.gnn-metric strong{font-size:14px;font-weight:800;line-height:1.15;letter-spacing:-.3px;overflow-wrap:anywhere;color:#202630}
.gnn-metric strong small{display:inline;font-size:9px;font-weight:600;letter-spacing:0;color:#404957}
.gnn-metric-label{grid-column:1/-1;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:9px;font-weight:500;line-height:1.15;overflow-wrap:anywhere;max-width:100%;color:#48515e}
.gnn-long-label{height:58px}.gnn-long-label .gnn-metric-label{-webkit-line-clamp:3}
.gnn-reference{display:block;font-size:10px;line-height:1.4;color:#647083;margin:4px 0 8px;overflow-wrap:anywhere}
.gnn-variant-note{font-size:9px;margin-top:-4px}
.gnn-is-collapsed .gnn-media>.gnn-reference{visibility:hidden}
.gnn-gallery{position:relative}
.gnn-rail-detail{top:24px;width:90px;max-height:var(--gnn-gallery-height,420px);display:flex;flex-direction:column}
.gnn-rail-detail .gnn-toggle{flex-shrink:0}
.gnn-rail-detail .gnn-rail-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.gnn-rail-detail .gnn-metric{height:54px;padding:7px}
.gnn-rail-detail .gnn-long-label{height:66px}
.gnn-rail-detail .gnn-metric strong{font-size:17px}
.gnn-rail-detail .gnn-metric-label{font-size:10px}
.gnn-rail-reference,.gnn-rail-note{display:block;padding:8px 5px;border-top:1px solid #e9ecf0;font-size:9px;line-height:1.35;color:#525e6c;overflow-wrap:anywhere}
.gnn-rail-note{font-size:8px;padding-top:0;border:0}
body.gna-app ul.products li.product.gnn-card .gnd-compare-button{align-self:stretch;justify-content:center;margin:9px 0 0;min-height:36px;background:#f5f6f8;color:#5d6674;border-color:#e0e4ec}
body.gna-app ul.products li.product.gnn-card .gnd-compare-button[aria-pressed=true]{color:var(--gnn-accent);border-color:var(--gnn-accent)}
@media(max-width:1024px){
 .gnn-desktop-only{display:none}
 .gnn-visual{min-height:calc(82px + var(--gnn-mobile-count,1)*42px + var(--gnn-mobile-long,0)*12px)}
 .gnn-rail{top:54px;width:66px}
 .gnn-metric{height:42px;padding:4px;gap:2px;grid-template-columns:10px minmax(0,1fr)}
 .gnn-metric svg{width:10px;height:10px}.gnn-metric strong{font-size:12px}.gnn-metric strong small{display:inline;font-size:8px}.gnn-metric-label{font-size:8.5px}.gnn-long-label{height:54px}.gnn-long-label .gnn-metric-label{font-size:8px}
 .gnn-reference{font-size:9px}
 .gnn-rail-detail{top:16px;width:72px}
 .gnn-rail-detail .gnn-metric{height:44px;padding:5px}.gnn-rail-detail .gnn-long-label{height:56px}.gnn-rail-detail .gnn-metric strong{font-size:14px}.gnn-rail-detail .gnn-metric-label{font-size:9px}
 body.gna-app ul.products li.product.gnn-card .gnd-compare-button{font-size:11px;min-height:38px;padding:6px}
}
@media(prefers-reduced-motion:reduce){.gnn-toggle .gnn-toggle-chevron{transition:none}}