.site-announcement{
  --announcement-bg:var(--store-primary,#2563eb);
  --announcement-fg:#fff;
  position:relative;
  z-index:80;
  width:100%;
  overflow:hidden;
  color:var(--announcement-fg);
  background:var(--announcement-bg);
  isolation:isolate;
}
.site-announcement__inner{
  width:min(100%,calc(var(--content-width,1400px) + 40px));
  min-height:42px;
  margin-inline:auto;
  padding:8px 20px;
  display:flex;
  align-items:center;
}
.site-announcement__content{
  width:100%;
  min-width:0;
  line-height:1.75;
  font-size:.9rem;
  overflow-wrap:anywhere;
  word-break:normal;
}
.site-announcement.align-center .site-announcement__content{text-align:center}
.site-announcement.align-right .site-announcement__content{text-align:right}
.site-announcement.align-left .site-announcement__content{text-align:left}
.site-announcement__content :where(p,h2,h3,h4,blockquote,ul,ol,figure,table,pre){margin-top:0;margin-bottom:0}
.site-announcement__content :where(p,h2,h3,h4){color:inherit}
.site-announcement__content h2{font-size:1.15em}.site-announcement__content h3{font-size:1.08em}.site-announcement__content h4{font-size:1em}
.site-announcement__content a{color:inherit;text-decoration:underline;text-underline-offset:3px;font-weight:700}
.site-announcement__content ul,.site-announcement__content ol{padding-inline-start:22px}
.site-announcement__content img{display:inline-block;max-width:100%;max-height:48px;width:auto;height:auto;vertical-align:middle;border-radius:8px}
.site-announcement__content table{max-width:100%;margin-inline:auto;border-collapse:collapse;color:inherit}
.site-announcement__content td,.site-announcement__content th{padding:2px 7px;border:1px solid currentColor}

.site-announcement--blue_gradient{
  color:#fff;
  background:linear-gradient(105deg,#0f3ea8 0%,#2563eb 48%,#06b6d4 100%);
}
.site-announcement--purple_gradient{
  color:#fff;
  background:linear-gradient(110deg,#581c87 0%,#7c3aed 52%,#db2777 100%);
}
.site-announcement--dark{
  color:#fff;
  background:linear-gradient(110deg,#0f172a 0%,#1e293b 58%,#111827 100%);
}
.site-announcement--warning{
  color:#422006;
  background:linear-gradient(110deg,#fde68a 0%,#fbbf24 55%,#fb923c 100%);
}
.site-announcement--success{
  color:#fff;
  background:linear-gradient(110deg,#065f46 0%,#059669 52%,#22c55e 100%);
}
.site-announcement--blue_gradient::before,
.site-announcement--purple_gradient::before,
.site-announcement--dark::before,
.site-announcement--warning::before,
.site-announcement--success::before{
  content:"";
  position:absolute;
  inset:-70% -8%;
  z-index:-1;
  pointer-events:none;
  opacity:.28;
  background:
    radial-gradient(circle at 18% 50%,rgba(255,255,255,.9) 0 2px,transparent 3px),
    radial-gradient(circle at 72% 35%,rgba(255,255,255,.55) 0 1px,transparent 2px),
    repeating-linear-gradient(118deg,transparent 0 38px,rgba(255,255,255,.18) 39px 40px,transparent 41px 76px);
  transform:rotate(-2deg);
}
.site-announcement--warning::before{opacity:.2}

@media(max-width:900px){
  .site-announcement__inner{min-height:38px;padding:7px 14px}
  .site-announcement__content{font-size:.84rem;line-height:1.7}
  .site-announcement__content img{max-height:40px}
}
@media(max-width:560px){
  .site-announcement__inner{min-height:36px;padding:6px 10px}
  .site-announcement__content{font-size:.8rem;line-height:1.65}
  .site-announcement__content h2{font-size:1.08em}
  .site-announcement__content h3{font-size:1.04em}
  .site-announcement__content ul,.site-announcement__content ol{padding-inline-start:18px}
  .site-announcement__content img{max-height:34px}
  .site-announcement__content table{display:block;overflow-x:auto;white-space:nowrap}
}