.chn{--chn-page:var(--color-canvas);--chn-fw:120px;--chn-fh:70px;--chn-pad:4px;--chn-gap:10px;--chn-face-r:var(--r-btn,8px);--chn-k:40px;--chn-maxh:40px;--chn-pi:12px;--chn-fade:28px;--chn-row-b:88%;--chn-row-gap:10px;--chn-hub:0px;padding-block:calc(var(--sec-pt) * .6) calc(var(--sec-pb) * .7);scroll-margin-top:calc(var(--header-top,14px) + var(--header-h,64px))}@media (min-width:700px){.chn{--chn-fw:160px;--chn-fh:92px;--chn-pad:5px;--chn-gap:14px;--chn-k:56px;--chn-maxh:52px;--chn-pi:18px;--chn-fade:72px;--chn-row-b:80%;--chn-row-gap:12px;--chn-hub:132px}}@media (min-width:1100px){.chn{--chn-fw:184px;--chn-fh:104px;--chn-pad:6px;--chn-gap:16px;--chn-k:64px;--chn-maxh:60px;--chn-pi:22px;--chn-fade:160px;--chn-row-b:70%;--chn-row-gap:14px;--chn-hub:156px}}.chn-head{width:min(100% - 2 * var(--gutter), 52rem);text-align:center;margin:0 auto 28px}@media (min-width:1100px){.chn-head{margin-bottom:40px}}.chn-title{font-family:var(--font-display);font-weight:700;line-height:1.3;font-size:calc(var(--fs-h2) * .82);text-wrap:balance;margin:0}.chn-lead{max-width:62ch;color:var(--color-text-muted);text-wrap:balance;margin:8px auto 0}.chn-stage{justify-items:center;row-gap:var(--chn-row-gap);width:min(100% - 2 * var(--panel-x,10px), var(--panel-max,1512px));margin-inline:auto;display:grid;position:relative}.chn-stage:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:6px;border-radius:var(--r-header,16px)}.chn-row{--chn-edge:linear-gradient(to left, transparent, #000 var(--chn-fade), #000 calc(100% - var(--chn-fade)), transparent);--chn-hole:linear-gradient(to left, #000 calc(50% - var(--chn-hub) / 2 - 44px), transparent calc(50% - var(--chn-hub) / 2 + 4px), transparent calc(50% + var(--chn-hub) / 2 - 4px), #000 calc(50% + var(--chn-hub) / 2 + 44px));width:100%;-webkit-mask:var(--chn-edge);-webkit-mask:var(--chn-edge);mask:var(--chn-edge);overflow:hidden}.chn-row--b{width:var(--chn-row-b)}@media (min-width:700px){.chn.chn-moving .chn-row{-webkit-mask:var(--chn-edge), var(--chn-hole);-webkit-mask-composite:source-in;-webkit-mask:var(--chn-edge), var(--chn-hole);mask:var(--chn-edge), var(--chn-hole);-webkit-mask-composite:source-in;mask-composite:intersect}}.chn-track{width:max-content;margin:0;padding:0;list-style:none;display:flex}.chn-tile{padding:var(--chn-pad);border-radius:calc(var(--chn-face-r) + var(--chn-pad));background:var(--color-surface-hover);flex:none;margin-inline-end:var(--chn-gap)}[data-theme=dark] .chn-tile{background:var(--color-surface-base);box-shadow:inset 0 0 0 1px var(--color-border)}.chn-tile img{--chn-lh:min(var(--chn-maxh), calc(var(--chn-k) / sqrt(var(--chn-r,1))));box-sizing:border-box;width:var(--chn-fw);height:var(--chn-fh);max-width:none;padding:calc((var(--chn-fh) - var(--chn-lh)) / 2) var(--chn-pi);object-fit:contain;border-radius:var(--chn-face-r);box-shadow:0 0 0 1px rgb(var(--ink,13 11 16) / .07);-webkit-user-select:none;user-select:none;-webkit-user-drag:none;background:#fff}.chn-hub{z-index:1;width:var(--chn-hub);aspect-ratio:1;border-radius:var(--r-header,24px);background:var(--color-surface-base);color:var(--color-text-main);box-shadow:inset 0 0 0 1px var(--color-border), var(--shadow-card);place-items:center;display:none;position:absolute;inset-block-start:50%;inset-inline-start:50%;translate:50% -50%}.chn-hub img{width:34%;height:auto}@media (min-width:700px){.chn.chn-moving .chn-hub{display:grid}}@keyframes chn-drift{0%{transform:translate(0)}to{transform:translateX(var(--chn-shift,0px))}}.chn.chn-moving .chn-track{animation:chn-drift var(--chn-dur,60s) linear infinite;will-change:transform}.chn.chn-moving .chn-row--b .chn-track{animation-direction:reverse}.chn.chn-moving .chn-stage:hover .chn-track,.chn.chn-moving .chn-stage:focus-visible .chn-track,.chn.chn-moving.chn-away .chn-track{animation-play-state:paused}@media (prefers-reduced-motion:reduce){.chn .chn-track{animation:none!important}}.chn:not(.chn-moving) .chn-row{width:100%;-webkit-mask:none;mask:none}@media (min-width:700px){.chn:not(.chn-moving) .chn-track{justify-content:center;row-gap:var(--chn-gap);flex-wrap:wrap;width:auto}.chn:not(.chn-moving) .chn-tile{margin-inline:calc(var(--chn-gap) / 2)}}@media (max-width:699px){.chn:not(.chn-moving) .chn-row{overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);padding-inline:var(--gutter);scrollbar-width:thin;scrollbar-color:var(--color-text-dim) transparent;padding-block-end:8px;overflow-x:auto}.chn:not(.chn-moving) .chn-tile{scroll-snap-align:start}}
