#cityrail-achievement-celebration {
  box-sizing: border-box;
  position: fixed;
  z-index: 2147483000;
  inset: max(76px, calc(env(safe-area-inset-top) + 64px)) 0 auto;
  margin: 0 auto;
  display: flex;
  align-items: center;
  width: min(424px, calc(100% - 24px));
  max-width: none;
  min-height: 148px;
  padding: 16px 44px 16px 16px;
  border-radius: 26px;
  border: 1px solid var(--ui-line);
  background: var(--material-popover, var(--ui-surface));
  color: var(--ui-text);
  box-shadow: var(--ui-shadow);
  -webkit-backdrop-filter: var(--material-blur, none);
  backdrop-filter: var(--material-blur, none);
  font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', sans-serif;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-16px) scale(.97);
  transition: opacity 220ms ease, transform 360ms cubic-bezier(.23, 1, .32, 1);
}
#cityrail-achievement-celebration[hidden] { display: none; }
#cityrail-achievement-celebration::backdrop { background: transparent; pointer-events: none; }
#cityrail-achievement-celebration[data-phase="visible"] { opacity: 1; transform: translateY(0) scale(1); }
#cityrail-achievement-celebration[data-phase="closing"] { opacity: 0; transform: translateY(-10px) scale(.985); transition-duration: 180ms; }
#cityrail-achievement-celebration .celebration-art { flex: 0 0 112px; width: 112px; height: 112px; margin-right: 17px; }
#cityrail-achievement-celebration img { display: block; width: 100%; height: 100%; object-fit: contain; opacity: 0; transform: translateY(7px) rotate(-7deg) scale(.87); transition: transform 520ms cubic-bezier(.23, 1, .32, 1), opacity 230ms ease; }
#cityrail-achievement-celebration[data-phase="visible"] img { opacity: 1; transform: translateY(0) rotate(0) scale(1); }
#cityrail-achievement-celebration .celebration-copy { min-width: 0; opacity: 0; transform: translateY(5px); transition: opacity 250ms ease 65ms, transform 300ms cubic-bezier(.23, 1, .32, 1) 65ms; }
#cityrail-achievement-celebration[data-phase="visible"] .celebration-copy { opacity: 1; transform: translateY(0); }
#cityrail-achievement-celebration .celebration-label { margin: 0 0 9px; font-size: 13px; font-weight: 550; color: var(--ui-muted); display: flex; gap: 6px; align-items: center; }
#cityrail-achievement-celebration svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; }
#cityrail-achievement-celebration h2 { color: inherit; font-size: 25px; font-weight: 650; line-height: 1.25; letter-spacing: -.6px; margin: 0; }
#cityrail-achievement-celebration .celebration-category { display: inline-block; margin-top: 8px; color: var(--ui-muted); font-size: 13px; }
#cityrail-achievement-celebration button { box-sizing: border-box; position: absolute; top: 2px; right: 2px; width: 44px; height: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 14px; background: transparent; box-shadow: none; font: inherit; font-size: 23px; color: var(--ui-muted); cursor: pointer; touch-action: manipulation; }
#cityrail-achievement-celebration button:active { opacity: .65; }
#cityrail-achievement-celebration button:focus-visible { outline: 2px solid var(--ui-focus); outline-offset: -5px; }
#cityrail-achievement-celebration .celebration-edge { position: absolute; bottom: 0; left: 22%; right: 22%; height: 1px; background: linear-gradient(90deg, transparent, var(--ui-muted), transparent); transform: scaleX(.15); opacity: 0; transition: transform 600ms cubic-bezier(.23, 1, .32, 1), opacity 450ms ease; }
#cityrail-achievement-celebration[data-phase="visible"] .celebration-edge { transform: scaleX(1); opacity: .32; }
#cityrail-achievement-celebration .celebration-announcement { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 540px) {
  #cityrail-achievement-celebration { border-radius: 23px; min-height: 128px; padding: 14px 36px 14px 10px; }
  #cityrail-achievement-celebration .celebration-art { flex-basis: 92px; width: 92px; height: 92px; margin-right: 12px; }
  #cityrail-achievement-celebration h2 { font-size: 22px; }
  #cityrail-achievement-celebration .celebration-label { font-size: 12px; }
}
@media (max-height: 450px) and (orientation: landscape) {
  #cityrail-achievement-celebration { inset-block-start: max(12px, env(safe-area-inset-top)); min-height: 112px; }
  #cityrail-achievement-celebration .celebration-art { flex-basis: 80px; width: 80px; height: 80px; }
}
@media (prefers-reduced-motion: reduce) {
  #cityrail-achievement-celebration[data-phase],
  #cityrail-achievement-celebration[data-phase] img,
  #cityrail-achievement-celebration[data-phase] .celebration-copy,
  #cityrail-achievement-celebration[data-phase] .celebration-edge { transform: none; transition: opacity 150ms ease; }
}
@media (prefers-reduced-transparency: reduce) {
  #cityrail-achievement-celebration { background: var(--ui-surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
}
