/* Hand-authored behavior and semantic templates; source geometry is in styles.css. */
body { background: #def3fa; }
a:focus-visible, [tabindex]:focus-visible { outline: 2px solid #136986; outline-offset: 5px; }
.question-frame { display: block; width: 100%; height: 100%; border: 0; }
#container .marquee-container { overflow-x: var(--marquee-overflow, clip); overflow-y: hidden; }
#container .marquee { animation: var(--marquee-animation, scroll var(--duration, 139s) linear infinite); }
#container .marquee + .marquee { display: var(--marquee-copy-display, flex); }
#container .marquee ul { display: flex; align-items: center; gap: 10px; position: relative; }
#container .marquee li { position: relative; flex-shrink: 0; }
#container .marquee .css-wcbkz4 { display: flex; flex-direction: row; align-items: center; border-radius: inherit; }
#container .marquee .css-b6e0g7 { display: flex; flex-direction: column; justify-content: center; align-items: center; }
#container .marquee .css-g4p9jj { aspect-ratio: 226/52; }
#container .marquee .css-9j1907 { width: 114.24%; height: 100%; top: 0%; left: .03%; max-width: none; }
#container .marquee-container:hover .marquee,
#container .marquee-container:focus-within .marquee { animation-play-state: paused; }
#container .marquee-container:focus-within {
  --marquee-overflow: auto;
  --marquee-animation: none;
  --marquee-copy-display: none;
}
#container [data-motion-visible="false"] [data-ambient-bubbles],
#container .marquee-container[data-motion-visible="false"] .marquee { animation-play-state: paused; }
html[data-motion-paused] #container [data-ambient-bubbles],
html[data-motion-paused] #container .marquee { animation-play-state: paused; }
#container .archive-grid { width: 1200px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
#container .event-card { width: 100%; min-width: 0; }
#container .event-card > div { max-width: 100%; }
#container .event-card > div:first-child { width: 100%; }
#container .event-card .css-9utc9, #container .event-card .css-pswb84 { width: 100%; }
.pill { display: inline-flex; width: fit-content; align-items: center; justify-content: center; gap: 5px; padding: 10px 20px; background: #ffffff80; color: #004d66; border: 1px solid #79cfec; border-radius: 1000px; font: 16px/1.4 "Vela Sans GX:Regular",sans-serif; }
.article-header { position: relative; display: flex; flex-direction: column; align-items: flex-start; width: 1200px; padding: 60px 0 90px; gap: 45px; }
.article-title { position: relative; font: 128px/1 "Vela Sans GX:Light",sans-serif; letter-spacing: -1.28px; color: #004d66; overflow-wrap: break-word; width: 100%; }
.article-date { position: relative; padding: 15px 30px; border-radius: 100px; background: #99e6ff; color: #004d66; font: 32px/1.3 "Vela Sans GX:Bold",sans-serif; letter-spacing: -.0096em; }
.article-bubbles { pointer-events: none; position: absolute; display: flex; align-items: center; justify-content: center; width: 3272.346px; height: 3451.482px; left: calc(50% - 1636px); top: calc(50% - 1726.343px); opacity: .5; }
.article-bubbles-inner { flex: 0 0 auto; position: relative; width: 2713.704px; height: 2181.344px; transform: matrix(.5185516,-.8550463,.8550463,.5185516,0,0); overflow: hidden; }
.article-bubbles [data-bubble-scene] { position: absolute; width: 101.85%; height: 121.26%; left: -.92%; top: -10.63%; max-width: none; }
.article-body { position: relative; width: 1200px; display: flex; flex-direction: column; align-items: center; gap: 30px; padding: 30px; border-radius: 30px; background: #fff; }
.article-cover { display: block; width: 100%; aspect-ratio: 390/240; object-fit: cover; border-radius: 15px; }
.article-copy { width: 100%; max-width: 720px; font: 24px/1.4 "Vela Sans GX:Regular",sans-serif; color: #191919; }
.article-copy p { min-height: 1.4em; }
.article-copy strong { font-family: "Vela Sans GX:Bold",sans-serif; }
.article-copy em { font-style: italic; }
.article-copy h2,.article-copy h3 { font: 32px/1.2 "Vela Sans GX:Bold",sans-serif; margin: 1em 0 .5em; }
.article-copy ul,.article-copy ol { padding-left: 1.5em; list-style: revert; }
.article-copy a:not(.pill) { text-decoration: underline; text-underline-offset: .12em; }
.article-link { margin-top: 30px; }
@media (hover: hover) {
  .pill:hover, #container a.css-up3tp5:hover { background-color: #79cfec80; }
}
@media (max-width:1279px) {
  #container .archive-grid { width: 100%; max-width: 1280px; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .article-header { width: 100%; max-width: 1280px; padding: 60px 0; gap: 33px; }
  .article-title { font-size: 72px; }
  .article-date { padding: 10px 20px; font-size: 24px; letter-spacing: -.1728px; }
  .article-bubbles { width: 2355.054px; height: 2505.07px; left: calc(50% - 1178px); top: calc(50% - 1252.594px); }
  .article-bubbles-inner { width: 1965.148px; height: 1573.474px; transform: matrix(.5153483,-.8569809,.8530922,.5217602,0,0); }
  .article-body { width: 100%; max-width: 1280px; padding: 20px; gap: 20px; }
  .article-copy { max-width: 720px; font-size: 20px; }
}
@media (max-width:799px) {
  #container .archive-grid { grid-template-columns: minmax(0,1fr); }
  #container .event-card { height: auto; }
  .article-header { padding: 40px 0; gap: 24px; }
  .pill { padding: 10px 15px; font-size: 12px; }
  .article-title { font-size: 32px; line-height: 1; }
  .article-date { padding: 5px 15px; font-size: 16px; letter-spacing: -.0768px; min-height: 34px; }
  .article-bubbles { width: 1326.916px; height: 1399.554px; left: calc(50% - 663.5px); top: calc(50% - 699.884px); }
  .article-bubbles-inner { width: 1100.39px; height: 884.521px; transform: matrix(.5185516,-.8550463,.8550463,.5185516,0,0); }
  .article-body { padding: 15px; gap: 15px; }
  .article-copy { max-width: none; font-size: 16px; }
  .article-link { margin-top: 20px; font-size: 14px; }
}
@media (max-width:374px) {
  #container [data-view="mobile"] > header:not(.article-header) h1 {
    font-size: clamp(48px, calc((100vw - 40px) * .19), 64px);
  }
}
@media (prefers-reduced-motion:reduce) {
  #container .marquee-container {
    --marquee-overflow: auto;
    --marquee-animation: none;
    --marquee-copy-display: none;
  }
}

/* Each masked bubble has its own orbit, period and phase; the scene stays still. */
[data-bubble-scene] { pointer-events: none; }
[data-ambient-bubbles] { transform-box: view-box; }
[data-bubble="1"] { --bubble-x: 24px; --bubble-y: -20px; --bubble-turn: 1.2deg; --bubble-duration: 19s; --bubble-delay: -4s; }
[data-bubble="2"] { --bubble-x: -34px; --bubble-y: 17px; --bubble-turn: -1.8deg; --bubble-duration: 27s; --bubble-delay: -13s; }
[data-bubble="3"] { --bubble-x: 20px; --bubble-y: 30px; --bubble-turn: -.9deg; --bubble-duration: 23s; --bubble-delay: -8s; }
[data-bubble="4"] { --bubble-x: -26px; --bubble-y: -24px; --bubble-turn: 1.4deg; --bubble-duration: 31s; --bubble-delay: -19s; }
[data-bubble="5"] { --bubble-x: 30px; --bubble-y: 22px; --bubble-turn: -2deg; --bubble-duration: 17s; --bubble-delay: -6s; }
@keyframes bubble-drift {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  35% { transform: translate(var(--bubble-x), var(--bubble-y)) rotate(var(--bubble-turn)); }
  70% { transform: translate(calc(var(--bubble-x) * -.65), calc(var(--bubble-y) * -.8)) rotate(calc(var(--bubble-turn) * -.6)); }
}
@media (prefers-reduced-motion:no-preference) {
  #container [data-ambient-bubbles] {
    animation: bubble-drift var(--bubble-duration) ease-in-out var(--bubble-delay) infinite;
  }
  .pill, #container a.css-up3tp5 {
    transition: translate 240ms cubic-bezier(.2,.8,.2,1), background-color 240ms ease, box-shadow 240ms ease;
  }
  @media (hover:hover) and (pointer:fine) {
    .pill:hover, #container a.css-up3tp5:hover {
      translate: 0 -2px;
      box-shadow: 0 5px 14px #004d6610;
    }
  }
  .pill:active, #container a.css-up3tp5:active { translate: 0 0; box-shadow: none; }
}