/* Preserve branding; controls and public-site decoration have scoped refinements. */
[hidden] { display: none !important; }
.primary-button, .ghost-button {
  min-height: 44px;
  padding: 10px 18px;
  border-radius: 8px;
  gap: 8px;
  transition: background-color 140ms ease, border-color 140ms ease;
}
.primary-button:hover, .ghost-button:hover,
.primary-button:active, .ghost-button:active {
  transform: none;
}
.primary-button svg, .ghost-button svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

/* Blue bubbles replace warm yellow decoration, without recoloring the logo. */
body.blue-public-site {
  --sun: #bfefff;
  background:
    radial-gradient(circle at 12% 12%, rgba(191, 239, 255, .7) 0 7%, transparent 7.5%),
    radial-gradient(circle at 84% 18%, rgba(68, 163, 202, .2) 0 5%, transparent 5.5%),
    radial-gradient(circle at 86% 78%, rgba(140, 207, 114, .26) 0 6%, transparent 6.5%),
    linear-gradient(180deg, #eaf8ff 0%, #f7fcff 48%, #ecf8ef 100%);
}
.blue-public-site::before {
  background-image:
    radial-gradient(circle at 18% 24%, transparent 0 12vw, rgba(68, 163, 202, .28) 12.2vw 13vw, transparent 13.2vw),
    radial-gradient(circle at 82% 65%, transparent 0 18vw, rgba(117, 199, 230, .4) 18.2vw 20vw, transparent 20.2vw);
}
.blue-public-site .capacity-bubble {
  background:
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, .22) 0 16%, transparent 17%),
    radial-gradient(circle at 86% 82%, rgba(191, 239, 255, .2) 0 18%, transparent 19%),
    linear-gradient(135deg, var(--ink), var(--success));
}
.blue-public-site .catalog-callout {
  background: linear-gradient(135deg, rgba(191, 239, 255, .5), rgba(234, 248, 255, .82));
}
.blue-public-site .date-pills span {
  background: rgba(191, 239, 255, .35);
  border-color: rgba(68, 163, 202, .25);
}
.blue-public-site .ninja-watermark-card {
  background:
    radial-gradient(circle at 18% 24%, transparent 0 34px, rgba(68, 163, 202, .1) 35px 46px, transparent 47px),
    radial-gradient(circle at 82% 34%, transparent 0 26px, rgba(117, 199, 230, .2) 27px 38px, transparent 39px),
    linear-gradient(135deg, rgba(255, 255, 255, .44), rgba(234, 248, 255, .56));
}
@media (max-width: 700px) {
  .blue-public-site .ninja-watermark-card { display: grid; place-items: center; min-height: 250px; }
  .blue-public-site .ninja-watermark-card img {
    position: static;
    width: min(78%, 280px);
    height: auto;
    max-height: 280px;
    object-fit: contain;
    transform: none;
  }
}
