.tts-app {
    --tts-accent: #f58019; --tts-card: #222; --tts-text: #f4f4f4; --tts-border: #484848; --tts-page: #1b1b1b;
    --tts-gap: 14px; --tts-columns: 4; --tts-image-height: 260px; --tts-logo-width: 112px; --tts-logo-height: 92px;
    --tts-logo-gap: 16px; --tts-radius: 0; --tts-hero-height: 220px; --tts-search-width: 520px; --tts-mobile-logo-width: 33.333%;
    color: var(--tts-text); font-family: inherit; container-type: inline-size;
}
.tts-app * { box-sizing: border-box; }
.tts-app a { color: inherit; }
.tts-hero { min-height: var(--tts-hero-height); display: flex; align-items: center; justify-content: center; padding: 30px; background-color: #333; background-image: linear-gradient(#0003,#0003),var(--tts-hero-image,none); background-size: cover; background-position: center; }
.tts-search-form { position: relative; width: min(100%,var(--tts-search-width)); }
.tts-search-form input { width: 100%; min-height: 48px; border: 0; border-radius: 999px; padding: 12px 48px; font: inherit; background: #fff; color: #333; }
.tts-search-form input:focus,.tts-search-form input:focus-visible { outline: 0; box-shadow: none; }
.tts-search-icon { position: absolute; left: 17px; top: 50%; display: flex; color: #111; transform: translateY(-50%); }
.tts-search-icon svg,.tts-carousel-button svg { fill: currentColor; }
.tts-makes { background: #fff; color: #222; padding: 0 28px 16px; }
.tts-makes>h2 { position: relative; background: var(--tts-accent); color: #fff; font-size: 14px; text-align: center; text-transform: uppercase; margin: 0 -28px 16px; padding: 14px; }
.tts-makes>h2:after { content: ""; position: absolute; left: 50%; bottom: -9px; transform: translateX(-50%); border: 10px solid transparent; border-top-color: var(--tts-accent); border-bottom: 0; }
.tts-carousel { position: relative; max-width: 1280px; margin: auto; }
.tts-make-track { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--tts-logo-gap); overflow: visible; padding: 0 44px; scrollbar-width: none; }
.tts-make-track::-webkit-scrollbar { display: none; }
.tts-make { width: var(--tts-logo-width); height: var(--tts-logo-height); flex: 0 0 var(--tts-logo-width); display: flex; align-items: center; justify-content: center; border: 1px solid #e3e3e3; background: #fff; color: #222!important; padding: 10px; text-decoration: none; text-align: center; overflow: hidden; }
.tts-make img { display: block; width: 100%; height: 100%; object-fit: contain; }
.tts-make strong { font-size: 15px; overflow-wrap: anywhere; }
.tts-make:hover,.tts-make.is-active { border-color: var(--tts-accent); box-shadow: inset 0 0 0 1px var(--tts-accent); }
.tts-carousel-button { display: none; }
.tts-carousel-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.tts-inventory { background: var(--tts-page); padding: 26px 14px 36px; }
.tts-toolbar { max-width: 1000px; margin: 0 auto 24px; display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; border-bottom: 4px solid var(--tts-accent); padding-bottom: 10px; }
.tts-toolbar h2 { margin: 0 0 4px; font-size: 26px; line-height: 1.1; text-transform: uppercase; color: inherit; }
.tts-toolbar p { margin: 0; font-size: 13px; }
.tts-toolbar label { font-size: 11px; font-weight: 700; text-transform: uppercase; white-space: nowrap; }
.tts-toolbar select { min-height: 34px; margin-left: 7px; border: 0; padding: 5px; background: #fff; color: #333; }
.tts-results { display: grid; grid-template-columns: repeat(var(--tts-columns),minmax(0,1fr)); gap: var(--tts-gap); max-width: 1900px; margin: auto; }
.tts-truck { min-width: 0; background: var(--tts-card); border: 1px solid var(--tts-border); border-radius: var(--tts-radius); overflow: hidden; cursor: pointer; }
.tts-truck header { display: flex; align-items: stretch; background: var(--tts-accent); color: #fff; }
.tts-truck header>div { min-width: 0; flex: 1; padding: 7px 10px; }
.tts-truck header small { display: block; font-size: 10px; font-weight: 700; }
.tts-truck h3 { font-size: 16px; line-height: 1.15; margin: 1px 0 0; text-transform: uppercase; color: inherit; overflow-wrap: anywhere; }
.tts-truck h3 a { text-decoration: none; }
.tts-yard-time { display: flex; align-items: center; max-width: 74px; background: #202020; padding: 7px 9px; font-size: 9px; line-height: 1.2; text-transform: uppercase; text-align: center; }
.tts-stock { position: absolute; z-index: 2; background: #202020e8; padding: 6px 10px; font-size: 13px; font-weight: 700; }
.tts-photo { display: block; height: var(--tts-image-height); line-height: 0; background: #333; }
.tts-photo img { display: block; width: 100%; height: 100%; object-fit: cover; margin: 0; }
.tts-details { display: block; background: var(--tts-accent); padding: 8px 12px; text-align: right; text-decoration: none; text-transform: uppercase; font-size: 11px; font-weight: 700; }
.tts-truck dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 18px; margin: 0; padding: 14px; }
.tts-truck dl>div { min-width: 0; }
.tts-truck dt { font-size: 9px; text-transform: uppercase; line-height: 1.3; }
.tts-truck dd { font-size: 13px; font-weight: 700; line-height: 1.35; margin: 2px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tts-empty { grid-column: 1/-1; padding: 25px; border: 1px solid var(--tts-border); }
.tts-pagination ul { display: flex; justify-content: center; gap: 8px; list-style: none; padding: 0; margin: 28px 0 0; }
.tts-pagination a,.tts-pagination .current { display: block; padding: 8px 13px; border: 1px solid var(--tts-border); text-decoration: none; }
.tts-pagination .current { background: var(--tts-accent); }
.tts-app :is(a,button,select):focus-visible { outline: 3px solid #57b8ff; outline-offset: 3px; }
.tts-sr { position: absolute!important; width: 1px!important; height: 1px!important; overflow: hidden!important; clip-path: inset(50%)!important; white-space: nowrap!important; }

@container(max-width:1100px) {
    .tts-results { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .tts-make-track { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scroll-snap-type: x proximity; }
    .tts-make { scroll-snap-align: start; }
}
@container(max-width:800px) {
    .tts-results { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .tts-toolbar { max-width: none; }
}
@container(max-width:650px) {
    .tts-hero { min-height: 180px; padding: 24px 14px; }
    .tts-makes { padding-inline: 8px; }
    .tts-makes>h2 { margin-inline: -8px; }
    .tts-carousel { display: grid; grid-template-columns: 36px minmax(0,1fr) 36px; align-items: center; gap: 8px; }
    .tts-make-track { grid-column: 2; grid-row: 1; min-width: 0; gap: var(--tts-logo-gap); padding: 4px 0; justify-content: flex-start; scroll-snap-type: x mandatory; }
    .tts-make { width: calc(var(--tts-mobile-logo-width) - var(--tts-logo-gap)); flex-basis: calc(var(--tts-mobile-logo-width) - var(--tts-logo-gap)); height: var(--tts-logo-height); }
    .tts-carousel-button { position: static; z-index: 3; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--tts-accent); color: #fff; box-shadow: 0 3px 10px #0003; cursor: pointer; }
    .tts-carousel-button:disabled { opacity: .35; cursor: default; }
    .tts-prev { grid-column: 1; grid-row: 1; } .tts-next { grid-column: 3; grid-row: 1; }
    .tts-carousel-status { grid-column: 1/-1; position: static; width: auto; height: auto; overflow: visible; clip-path: none; text-align: center; font-size: 11px; margin-top: 2px; color: #555; }
    .tts-inventory { padding-inline: 9px; }
    .tts-toolbar { align-items: flex-start; }
    .tts-results { grid-template-columns: 1fr; }
    .tts-photo { height: max(var(--tts-image-height),260px); }
}
@container(max-width:420px) {
    .tts-toolbar { display: block; }
    .tts-toolbar form { margin-top: 14px; }
    .tts-toolbar h2 { font-size: 23px; }
    .tts-truck h3 { font-size: 15px; }
    .tts-truck dl { gap: 12px; }
    .tts-search-form input { padding-right: 18px; }
}
