.tr-stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,640px) minmax(0,1fr);grid-gap:clamp(20px,3vw,48px);gap:clamp(20px,3vw,48px);padding:0 clamp(16px,2.4vw,40px);max-width:1640px;margin:0 auto}.tr-main{min-width:0}.tr-main .co-page{margin:0 auto}.tr-col{position:-webkit-sticky;position:sticky;top:72px;align-self:start;height:calc(100vh - 96px);max-height:980px;overflow:hidden;margin-top:96px;-webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}.tr-col .tr-track{display:grid;grid-gap:14px;gap:14px;justify-items:center;animation:tr-up 48s linear infinite;will-change:transform}.tr-col.tr-right .tr-track{animation-name:tr-down;animation-duration:54s}@keyframes tr-up{0%{transform:translateY(0)}to{transform:translateY(-50%)}}@keyframes tr-down{0%{transform:translateY(-50%)}to{transform:translateY(0)}}.tr-col:hover .tr-track{animation-play-state:paused}.tr-tile{position:relative;margin:0;width:100%;max-width:340px;overflow:hidden;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:#0e0e12;box-shadow:0 18px 40px -24px rgba(0,0,0,.9)}.tr-tile.tr-wide{aspect-ratio:16/9}.tr-tile.tr-tall{aspect-ratio:9/13;max-width:250px}.tr-tile img,.tr-tile video{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform .6s ease}.tr-col:hover .tr-tile img,.tr-col:hover .tr-tile video{transform:scale(1.06)}.tr-compare img{inset:0}.tr-compare img,.tr-compare img:first-child{position:absolute}.tr-compare .tr-after{-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0);animation:tr-wipe 7s ease-in-out infinite}.tr-handle{top:0;bottom:0;left:0;width:3px;margin-left:-1.5px;box-shadow:0 0 12px rgba(0,0,0,.45);animation:tr-wipe-handle 7s ease-in-out infinite;pointer-events:none}.tr-handle,.tr-handle:after{position:absolute;background:#fff}.tr-handle:after{content:"⟷";top:50%;left:50%;width:28px;height:28px;margin:-14px;border-radius:50%;color:#111;display:grid;place-items:center;font-size:13px;font-weight:800}.tr-tag{position:absolute;top:8px;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;z-index:1}.tr-tag-a{left:8px;background:rgba(8,8,12,.7);color:#f3f1ec}.tr-tag-b{right:8px;background:var(--ac,#ff2d78);color:#fff}@keyframes tr-wipe{0%,8%{-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0)}42%,58%{-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0)}92%,to{-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0)}}@keyframes tr-wipe-handle{0%,8%{left:0}42%,58%{left:100%}92%,to{left:0}}.tr-tile figcaption{position:absolute;left:10px;bottom:9px;padding:3px 9px;border-radius:999px;background:rgba(8,8,12,.66);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#f3f1ec;font-size:11.5px;font-weight:650}.tr-left .tr-tile{justify-self:end}.tr-right .tr-tile{justify-self:start}.tr-strip{display:none}@media (max-width:1099px){.tr-stage{display:block;padding:0}.tr-col{display:none}.tr-strip{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 0 18px;padding-bottom:4px;scrollbar-width:none}.tr-strip::-webkit-scrollbar{display:none}.tr-strip .tr-tile{flex:0 0 62%;max-width:260px;scroll-snap-align:start;border-radius:14px}}@media (prefers-reduced-motion:reduce){.tr-col .tr-track{animation:none}.tr-col:hover .tr-tile img,.tr-col:hover .tr-tile video,.tr-tile img,.tr-tile video{transition:none;transform:none}.tr-compare .tr-after,.tr-handle{animation:none}.tr-compare .tr-after{-webkit-clip-path:inset(0 0 0 50%);clip-path:inset(0 0 0 50%)}.tr-handle{left:50%}}.tr-fixed{--tr-w:clamp(0px,calc(50vw - 230px - 64px),340px);position:fixed;top:0;bottom:0;width:var(--tr-w);height:100vh;max-height:none;margin:0;z-index:1;pointer-events:none}.tr-fixed.tr-left{left:calc(50vw - 230px - 40px - var(--tr-w))}.tr-fixed.tr-right{right:calc(50vw - 230px - 40px - var(--tr-w))}@media (max-width:1099px){.tr-fixed{display:none}}