@layer platform {
  :root:has([data-platform~=ios]) {
    &[data-text-size=xsmall] { font-size: 14px; }
    &[data-text-size=small] { font-size: 15px; }
    &[data-text-size=medium] { font-size: 16px; }
    &[data-text-size=large] { font-size: 17px; }
    &[data-text-size=xlarge] { font-size: 19px; }
    &[data-text-size=xxlarge] { font-size: 21px; }
    &[data-text-size=xxxlarge] { font-size: 23px; }
  }

  [data-platform~=ios] {
    .hide-on-ios {
      display: none;
    }

    /* Events
    /* ------------------------------------------------------------------------ */

    .events__column-header {
      background-color: unset;

      & > span {
        display: inline-block;
        position: relative;

        &::before {
          content: "";
          display: block;
          background-color: oklch(from var(--color-canvas) l c h / 0.8);
          -webkit-backdrop-filter: blur(16px);
          backdrop-filter: blur(16px);
          border-radius: 10em;
          position: absolute;
          inset-inline: -1.5ch;
          inset-block: calc(var(--events-gap) * -0.8);
          z-index: -1;
        }
      }
    }
  }
}