/* Gridbox Stories - all selectors are scoped; does not alter Gridbox menu or header. */
.gbs-root,.gbs-root *, .gbs-tooltip,.gbs-tooltip * { box-sizing: border-box; }
.gbs-root {
  --gbs-final-size: var(--gbs-size-desktop,46px);
  display: flex; align-items: center; justify-content: flex-start;
  width: max-content; max-width: 100%; min-width: 0;
  position: relative; isolation: isolate;
  font-family: inherit; line-height: normal;
}
.gbs-root.gbs-align-center { justify-content: center; margin-inline: auto; }
.gbs-root.gbs-align-end { justify-content: flex-end; margin-inline-start: auto; }
.gbs-list { display: flex !important; gap: var(--gbs-gap,9px) !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center; width: max-content; max-width: 100%; min-width: 0; margin: 0; padding: 0; }
.gbs-story { flex: 0 0 auto; margin: 0 !important; padding: 0 !important; position: relative; min-width: 0; }
.gbs-story__link {
  display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important;
  gap: 4px; text-decoration: none !important; margin: 0 !important; padding: 0 !important;
  border: 0 !important; background: none !important; box-shadow: none !important;
  line-height: 1.2 !important; border-radius: 999px; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.gbs-story__link:hover, .gbs-story__link:focus { text-decoration: none !important; }
.gbs-story__link:focus-visible { outline: 2px solid var(--gbs-ring-a); outline-offset: 5px; }
.gbs-circle {
  display: flex !important; align-items: center; justify-content: center; position: relative;
  flex: 0 0 var(--gbs-final-size); width: var(--gbs-final-size); height: var(--gbs-final-size);
  border-radius: 50%; padding: calc(var(--gbs-ring,3px) + 2px); overflow: hidden;
  transition: transform .25s ease; background: transparent;
}
.gbs-circle::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, var(--gbs-ring-a) 0%, var(--gbs-ring-b) 25%, #fff1b8 45%, var(--gbs-ring-a) 70%, var(--gbs-ring-b) 100%);
  animation: gbs-rotate var(--gbs-spin,4s) linear infinite; will-change: transform;
}
.gbs-circle::after {
  content: ""; position: absolute; inset: var(--gbs-ring,3px); border-radius: 50%;
  background: var(--gbs-bg, #fff); pointer-events: none;
}
.gbs-picture {
  display: flex !important; align-items: center; justify-content: center; position: relative;
  z-index: 2; overflow: hidden; border-radius: 50%;
  width: 100%; height: 100%; background: linear-gradient(145deg,#f0f7fa,#dceaf3);
  color: #6589a0; box-shadow: 0 0 0 1px rgba(50,75,85,.07);
}
.gbs-picture img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 50%; }
.gbs-fallback { width: 46%; height: 46%; display:block; }
.gbs-story__link:hover .gbs-circle { transform: scale(1.06); }
.gbs-story.is-seen .gbs-circle::before { animation: none !important; opacity: 0; }
.gbs-story.is-seen .gbs-circle::after { background: transparent; }
.gbs-story.is-seen .gbs-picture { box-shadow: 0 0 0 1px rgba(100,130,145,.16); }
.gbs-caption { display: block; max-width: calc(var(--gbs-final-size) + 16px); font-weight: 500; font-size: 10px; line-height: 1.25; color: inherit; text-align: center; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
@keyframes gbs-rotate { to { transform: rotate(360deg); } }
@media (max-width:1024px) { .gbs-root { --gbs-final-size: var(--gbs-size-tablet,42px); } }
@media (max-width:767px) { .gbs-root { --gbs-final-size: var(--gbs-size-mobile,38px); } }
@media (prefers-reduced-motion: reduce) { .gbs-circle::before { animation: none !important; will-change: auto; } .gbs-circle { transition: none; } }
/* Tooltip is moved to document.body so Gridbox header overflow cannot crop it. */
.gbs-tooltip {
  --gbs-arrow-x: 50%;
  display: block; position: fixed; inset: auto; z-index: 2147483000;
  width: max-content; max-width: min(var(--gbs-tooltip-width,244px), calc(100vw - 16px));
  min-width: 156px; padding: 12px 15px; pointer-events: none;
  border-radius: 13px; background: var(--gbs-tooltip-bg,#172330) !important; color: var(--gbs-tooltip-fg,#fff) !important;
  box-shadow: 0 10px 35px rgba(7,18,35,.18), 0 3px 8px rgba(7,18,35,.1);
  text-align: left; line-height: 1.3; font-family: inherit;
  opacity: 0; transform: translateY(5px); transition: opacity .23s ease, transform .23s ease;
}
.gbs-tooltip[hidden] { display: none !important; }
.gbs-tooltip.is-visible { opacity: 1; transform: translateY(0); }
.gbs-tooltip::after {
  content: ""; position: absolute; bottom: -6px; left: var(--gbs-arrow-x,50%);
  width: 13px; height: 13px; background: inherit; border-radius: 2px;
  transform: translateX(-50%) rotate(45deg);
}
.gbs-tooltip.gbs-tooltip--below::after { top: -6px; bottom: auto; }
.gbs-tooltip__heading { font-size: 13px; line-height: 1.4; font-weight: 650; display: block; color: inherit !important; white-space: normal; }
.gbs-tooltip__subtitle { font-size: 11px; font-weight: 400; line-height: 1.4; opacity: .81; display: block; margin-top: 3px; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: inherit !important; }
@media (prefers-reduced-motion: reduce) { .gbs-tooltip { transition: none; } }