.event-banner{--event-background:#38134f;--event-ink:#fff;--event-accent:#ffd6f2;--event-crop:50% 50%;background:var(--event-background);color:var(--event-ink);border-bottom:2px solid var(--event-accent)}.event-banner[data-flyer=oktoberfest]{--event-background:#123e6c;--event-ink:#fff1d8;--event-accent:#e9be73;--event-crop:50% 24%}.event-banner[data-flyer=winter]{--event-background:#0b2a61;--event-ink:#fff8e9;--event-accent:#f3cf80;--event-crop:50% 36%}.event-banner__inner{align-items:center;gap:16px;min-height:56px;padding-block:0;display:flex}.event-banner__artwork{object-fit:cover;object-position:var(--event-crop);border-inline:1px solid var(--event-accent);flex:none;width:148px;height:56px;display:block}.event-banner__viewport{flex:1;min-width:0;position:relative}.event-banner__label{overflow-wrap:anywhere;margin:0;padding-block:8px;font-size:.875rem;font-weight:600;line-height:1.5}.event-banner__track{display:none}.event-banner__details,.event-banner__pause{min-height:44px;color:inherit;font:inherit;background:0 0;border:0;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.event-banner__details{white-space:nowrap;text-underline-offset:4px;text-decoration:underline;-webkit-text-decoration-color:var(--event-accent);text-decoration-color:var(--event-accent);gap:8px;padding-inline:10px;font-size:.875rem;font-weight:700}.event-banner__details svg{flex-shrink:0}.event-banner__pause{cursor:pointer;width:44px;padding:0}.event-banner__pause[hidden],.event-banner__play-icon,.event-banner__pause[aria-pressed=true] .event-banner__pause-icon{display:none}.event-banner__pause[aria-pressed=true] .event-banner__play-icon{display:block}.event-banner :focus-visible{outline:2px solid var(--event-accent);outline-offset:-3px}.event-banner[data-motion=on] .event-banner__viewport{overflow:hidden}.event-banner[data-motion=on] .event-banner__label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.event-banner[data-motion=on] .event-banner__track{width:max-content;display:flex}.event-banner__group{white-space:nowrap;flex-shrink:0;font-size:.875rem;font-weight:600;line-height:1.5;display:flex}.event-banner__entry{flex-shrink:0;padding-inline-end:64px;display:block}@media (hover:hover) and (pointer:fine){.event-banner__details:hover,.event-banner__pause:hover{background:#ffffff16}}.event-banner__pause:active:not(:focus-visible){transform:scale(.97)}@media (max-width:700px){.event-banner__inner{gap:6px}.event-banner__artwork{width:88px}.event-banner__details{gap:5px;padding-inline:6px}}@media (max-width:359px){.event-banner__inner{gap:4px}.event-banner__artwork{width:72px}.event-banner__details{gap:4px;padding-inline:4px}}@media (prefers-reduced-motion:reduce){.event-banner[data-motion=on] .event-banner__viewport{overflow:visible}.event-banner[data-motion=on] .event-banner__label{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding-block:8px;position:static;overflow:visible}.event-banner[data-motion=on] .event-banner__track,.event-banner__pause{display:none}}
