.sushi-smok-banners {
position: relative;
box-sizing: border-box;
width: 100%;
max-width: 100%;
min-width: 0;
margin: 0;
background: #000;
color: #f4eedf;
font-family: inherit;
isolation: isolate;
}
.sushi-smok-banners .ssb-track {
position: relative;
width: 100%;
aspect-ratio: 95 / 26;
touch-action: pan-y pinch-zoom;
}
.sushi-smok-banners .ssb-slide,
.sushi-smok-banners .ssb-picture,
.sushi-smok-banners .ssb-hitareas {
position: absolute;
inset: 0;
display: block;
margin: 0;
}
.sushi-smok-banners [hidden] { display: none !important; }
.sushi-smok-banners .ssb-slide {
z-index: 0;
opacity: 0;
pointer-events: none;
transition: opacity 600ms ease-in-out;
}
.sushi-smok-banners .ssb-slide[data-active="true"] {
z-index: 1;
opacity: 1;
pointer-events: auto;
}
.sushi-smok-banners .ssb-picture img {
display: block;
width: 100%;
height: 100%;
max-width: 100%;
margin: 0;
border: 0;
border-radius: 0;
object-fit: contain;
}
.sushi-smok-banners .ssb-hitareas-combined {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
grid-template-rows: minmax(0, 1fr);
grid-template-areas: "news best";
}
.sushi-smok-banners .ssb-link {
display: block;
width: 100%;
height: 100%;
min-width: 0;
color: inherit;
border: 0;
background: transparent;
text-decoration: none;
}
.sushi-smok-banners .ssb-link-news { grid-area: news; }
.sushi-smok-banners .ssb-link-best { grid-area: best; }
.sushi-smok-banners .ssb-controls {
position: absolute;
z-index: 2;
bottom: 8px;
left: 50%;
display: flex;
align-items: center;
gap: 0;
transform: translateX(-50%);
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
color: #ead39b;
}
.sushi-smok-banners .ssb-dots { display: flex; align-items: center; }
.sushi-smok-banners .ssb-dot {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
width: 44px;
height: 44px;
min-width: 44px;
min-height: 44px;
margin: 0;
padding: 0;
border: 0;
border-radius: 22px;
background: transparent;
box-shadow: none;
color: inherit;
cursor: pointer;
appearance: none;
-webkit-appearance: none;
touch-action: manipulation;
}
.sushi-smok-banners .ssb-dot span {
display: block;
width: 9px;
height: 9px;
border: 1px solid #d0b885;
border-radius: 50%;
background: rgba(8, 8, 6, .45);
box-shadow: 0 0 0 2px rgba(8, 8, 6, .45);
}
.sushi-smok-banners .ssb-dot[aria-pressed="true"] span { background: #ead39b; border-color: #ead39b; }
.sushi-smok-banners .ssb-dot:hover span { border-color: #f4eedf; }
.sushi-smok-banners button.ssb-dot:hover,
.sushi-smok-banners button.ssb-dot:focus,
.sushi-smok-banners button.ssb-dot:active {
background: transparent;
background-color: transparent;
background-image: none;
color: #ead39b;
border-color: transparent;
box-shadow: none;
}
.sushi-smok-banners:focus-visible { outline: 2px solid #ead39b; outline-offset: -2px; }
.sushi-smok-banners .ssb-link:focus-visible { outline: 3px solid #ead39b; outline-offset: -4px; }
.sushi-smok-banners button:focus-visible { outline: 2px solid #ead39b; outline-offset: -4px; }
.sushi-smok-banners .ssb-sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
@media (max-width: 767px) {
.sushi-smok-banners .ssb-track { aspect-ratio: 1; }
.sushi-smok-banners .ssb-hitareas-combined {
grid-template-columns: minmax(0, 1fr);
grid-template-rows: repeat(2, minmax(0, 1fr));
grid-template-areas: "best" "news";
}
}
@media (prefers-reduced-motion: reduce) {
.sushi-smok-banners:not([data-ssb-motion="allowed"]) .ssb-slide { transition: none !important; }
.sushi-smok-banners * { scroll-behavior: auto !important; }
}