.tt-product-tile{display:block;min-width:0}
.tt-product-tile__media{display:flex;position:relative;aspect-ratio:2/3;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:var(--tt-surface)}
.tt-product-tile__media::-webkit-scrollbar{display:none}
.tt-product-tile__slide{display:block;position:relative;flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always}
.tt-product-tile__slide img,.tt-product-tile__slide svg,.tt-product-tile__video{display:block;width:100%;height:100%;object-fit:cover}
.tt-product-tile__slide img{width:calc(100% + 1px);max-width:none}
.tt-product-tile__video{position:absolute;inset:0;opacity:0;pointer-events:none}
.tt-product-tile[data-playing] .tt-product-tile__video{opacity:1}
.tt-product-tile__chip{position:absolute;left:8px;top:8px;z-index:1;padding:3px 7px;border-radius:var(--tt-radius-pill);background:var(--tt-surface-inverse);color:var(--tt-on-inverse);font:500 11px var(--tt-font-mono)}
.tt-product-tile__controls{display:flex;justify-content:center;align-items:center;flex-wrap:wrap}
.tt-product-tile__dots{display:flex;gap:5px;padding:17px 0}
.tt-product-tile__dots span{width:10px;height:10px;border:1px solid var(--tt-ink-muted);border-radius:50%}
.tt-product-tile__dots [aria-current=true]{background:var(--tt-ink)}
.tt-product-tile__frame{position:relative}
.tt-product-tile__motion{position:absolute;right:10px;bottom:10px;z-index:2;display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:rgba(17,17,17,.7);color:#fff;cursor:pointer}
.tt-product-tile__motion::before{content:"";position:absolute;inset:-6px}
.tt-product-tile__motion svg{width:14px;height:14px;fill:currentColor}
.tt-product-tile__motion[data-paused] .tt-product-tile__pause,.tt-product-tile__motion:not([data-paused]) .tt-product-tile__play{display:none}
.tt-product-tile .tt-product-tile__motion:focus-visible{outline:3px solid #fff;outline-offset:0;box-shadow:0 0 0 6px #111}
.tt-product-tile__motion[hidden]{display:none}
.tt-product-tile__meta{display:grid;justify-items:start;gap:8px;padding-top:12px}
.tt-product-tile__title{color:var(--tt-ink);font:700 15px/1.3 var(--tt-font-display);text-decoration:none}
.tt-product-tile__price,.tt-product-tile__facts{margin:0}
.tt-product-tile__facts{color:var(--tt-ink-muted);font-size:12px;line-height:1.5}
.tt-product-tile__colours{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.tt-product-tile__colour{position:relative;display:grid;place-items:center;width:44px;height:44px}
.tt-product-tile__colour span:first-child{width:14px;height:14px;border-radius:50%;background:var(--tt-colour,transparent);border:1px solid var(--tt-ink-muted)}

.tt-product-tile :is(a,button):focus-visible{outline:3px solid var(--tt-focus);outline-offset:-3px;box-shadow:inset 0 0 0 5px #fff}
@media(hover:hover) and (min-width:990px){.tt-product-tile__media:has(.tt-product-tile__design):not(:has(.tt-product-tile__video)):hover .tt-product-tile__design{position:absolute;inset:0;background:var(--tt-code-chip-bg)}}
@media(hover:hover) and (min-width:990px) and (prefers-reduced-motion:no-preference){.tt-product-tile__media:not(:has(.tt-product-tile__video)):hover .tt-product-tile__design{animation:tt-fade .3s}@keyframes tt-fade{from{opacity:0}}}
@media(prefers-reduced-motion:reduce){.tt-product-tile__video,.tt-product-tile__motion{display:none}.tt-product-tile__media{scroll-behavior:auto}}
@media(max-width:767px){.tt-product-tile--collection{margin:0 -2px -6px}.tt-product-tile--collection :is(.tt-product-tile__colours,.tt-product-tile__range){display:none}}
.tt-product-tile--collection .tt-product-tile__title{font:600 14px/1.3 var(--tt-font-body)}
@media(min-width:768px){.tt-product-tile--collection{margin:0 2px 6px}.tt-product-tile--collection .tt-product-tile__media{aspect-ratio:4/5}.tt-product-tile--collection .tt-product-tile__title{grid-column:1/3;font-size:16px}.tt-product-tile--collection .tt-product-tile__meta{grid-template-columns:auto 1fr auto;align-items:baseline;gap:6px 10px}.tt-product-tile--collection .tt-product-tile__price{grid-column:3;justify-self:end}.tt-product-tile--collection .tt-product-tile__colours{gap:2px}.tt-product-tile--collection .tt-product-tile__colour{width:24px;height:24px}.tt-product-tile--collection .tt-product-tile__range{grid-column:2/4;margin:0;color:var(--tt-ink-muted);font:400 12px var(--tt-font-mono)}.tt-product-tile--collection .tt-product-tile__facts{grid-column:1/-1}}
@media(min-width:1280px){.tt-product-tile--collection{margin-inline:-2px}}
@media(hover:hover) and (min-width:990px){.tt-product-tile__dots{display:none}}
.tt-product-tile__more{display:none}
.tt-product-tile--compact .tt-product-tile__dots{gap:4px}.tt-product-tile--compact .tt-product-tile__dots span{width:8px;height:8px}
@media(max-width:749px){.tt-product-tile__colours{flex-wrap:nowrap;overflow:hidden;gap:0}.tt-product-tile__colour{width:24px;height:32px}.tt-product-tile__colour::after{content:"";position:absolute;inset:-6px -1px}.tt-product-tile__colour span:first-child{width:10px;height:10px}.tt-product-tile__colour-extra{display:none}.tt-product-tile__more{display:flex;align-items:center;margin-left:4px;color:var(--tt-ink-muted);font:500 11px var(--tt-font-mono);white-space:nowrap}}
.tt-product-tile__meta{container-type:inline-size}
@media(min-width:750px){.tt-product-tile__colours{flex-wrap:nowrap;overflow:hidden;gap:0}.tt-product-tile__colour{width:24px;height:24px}.tt-product-tile--collection .tt-product-tile__colours{gap:0}@container(max-width:219px){.tt-product-tile__colour-extra{display:none}.tt-product-tile__more{display:flex;align-items:center;margin-left:4px;color:var(--tt-ink-muted);font:500 11px var(--tt-font-mono);white-space:nowrap}}}
.tt-product-tile__colour[aria-current] span:first-child{outline:2px solid var(--tt-ink);outline-offset:2px}