.context-switch-chart_container__c86qB {
  position: relative;
  padding: 20px 0;
}
@media (min-width: 768px) {
  .context-switch-chart_container__c86qB {
    padding: 100px 0;
  }
}
.context-switch-chart_bg__AO5KH {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 700px;
  max-width: calc(100vw - 24px);
  margin: 0 auto;
  -o-object-fit: cover;
  object-fit: cover;
  filter: hue-rotate(100deg) saturate(0.75);
  -webkit-mask-image: linear-gradient(
    180deg,
    transparent 0,
    #000 50%,
    transparent
  );
  mask-image: linear-gradient(180deg, transparent 0, #000 50%, transparent);
  transform: translate(-50%, -50%);
}
.context-switch-chart_box___0rAh {
  max-width: 660px;
  padding: 24px;
  margin: 0 auto;
  background: linear-gradient(
    137deg,
    rgba(17, 18, 20, 0.82) 4.87%,
    rgba(12, 13, 15, 0.82) 75.88%
  );
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid hsla(0, 0%, 100%, 0.06);
  border-radius: 12px;
  box-shadow: inset 0 1px 0 0 hsla(0, 0%, 100%, 0.1);
  transform: translateZ(0);
}
@media (min-width: 768px) {
  .context-switch-chart_box___0rAh {
    padding: 40px;
  }
}
.context-switch-chart_header__u0ktb {
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 32px;
}
@media (min-width: 768px) {
  .context-switch-chart_header__u0ktb {
    flex-direction: row;
    align-items: center;
  }
}
.context-switch-chart_headerTitle__aSt3_ {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 0.2px;
}
@media (min-width: 768px) {
  .context-switch-chart_headerTitle__aSt3_ {
    font-size: 20px;
  }
}
.context-switch-chart_headerSource__5GIim {
  font-size: 12px;
  font-weight: 500;
  color: hsla(0, 0%, 100%, 0.6);
  text-decoration: underline;
  letter-spacing: 0.2px;
}
.context-switch-chart_headerSource__5GIim:focus,
.context-switch-chart_headerSource__5GIim:hover {
  color: hsla(0, 0%, 100%, 0.8);
  outline: none;
}
.context-switch-chart_headerSource__5GIim:focus-visible {
  border-radius: 4px;
  box-shadow: 0 0 0 2px hsla(0, 0%, 100%, 0.8);
}
.context-switch-chart_chart__M8bUW {
  display: flex;
  align-items: center;
  height: 36px;
  margin-bottom: 16px;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: inset 0 1px 0 0 hsla(0, 0%, 100%, 0.1);
}
.context-switch-chart_bar__c27OQ {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40%;
  height: 100%;
  font-family: var(--monospace-font);
  font-size: 12px;
  color: hsla(0, 0%, 100%, 0.6);
  white-space: nowrap;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.24), transparent),
    hsla(0, 0%, 100%, 0.1);
  transition: width 2.8s cubic-bezier(0.175, 0.685, 0.32, 1);
}
@media (min-width: 768px) {
  .context-switch-chart_bar__c27OQ {
    font-size: 14px;
  }
}
.context-switch-chart_bar__c27OQ.context-switch-chart_filled__tRME_ {
  position: relative;
  width: 60%;
  color: #fff;
  background: linear-gradient(
      180deg,
      hsla(0, 0%, 100%, 0.4) 11.59%,
      rgba(0, 0, 0, 0.4) 88.41%
    ),
    rgba(1, 90, 66, 0.9);
  background-blend-mode: soft-light, normal;
  border-right: 1px solid #015a42;
  box-shadow: 0 104px 29px 0 rgba(1, 90, 66, 0),
    0 66px 27px 0 rgba(1, 90, 66, 0.04), 0 37px 22px 0 rgba(1, 90, 66, 0.13),
    0 17px 17px 0 rgba(1, 90, 66, 0.22), 0 4px 9px 0 rgba(1, 90, 66, 0.25);
}
.context-switch-chart_bar__c27OQ.context-switch-chart_filled__tRME_:after {
  position: absolute;
  top: -5%;
  right: 0;
  bottom: -5%;
  width: 12px;
  content: "";
  background: #015a42;
  filter: blur(10px);
  transform: translateZ(0);
}
.context-switch-chart_filled__tRME_ {
  width: 60%;
  color: #fff;
}
.context-switch-chart_legend__MIHzK {
  display: flex;
  flex-direction: column;
  gap: 6px;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .context-switch-chart_legend__MIHzK {
    flex-direction: row;
    align-items: center;
  }
}
.context-switch-chart_legendItem__JfKXu {
  display: flex;
  gap: 8px;
  align-items: center;
  font-family: var(--monospace-font);
  font-size: 12px;
  color: hsla(0, 0%, 100%, 0.6);
}
@media (min-width: 768px) {
  .context-switch-chart_legendItem__JfKXu {
    font-size: 14px;
  }
  .context-switch-chart_legendItem__JfKXu.context-switch-chart_reversed__pHBsy {
    flex-direction: row-reverse;
  }
}
.context-switch-chart_legendItemColor__UacG1 {
  width: 12px;
  height: 12px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.24), transparent),
    hsla(0, 0%, 100%, 0.1);
  background-blend-mode: soft-light, normal;
  border-radius: 4px;
  box-shadow: inset 0 0 0 1px hsla(0, 0%, 100%, 0.1);
}
.context-switch-chart_legendItemColor__UacG1.context-switch-chart_filled__tRME_ {
  background: linear-gradient(
      180deg,
      hsla(0, 0%, 100%, 0.4) 11.59%,
      rgba(0, 0, 0, 0.4) 88.41%
    ),
    rgba(1, 90, 66, 0.9);
  background-blend-mode: soft-light, normal;
}
.focus-bar_focusBar__HSu4w {
  display: flex;
  gap: 10px;
  align-items: center;
  width: 230px;
  padding: 8px;
  overflow: hidden;
  font-size: 14px;
  background: linear-gradient(
      0deg,
      color(display-p3 0 0 0/0.35),
      color(display-p3 0 0 0/0.35)
    ),
    color(display-p3 1 1 1/0.1);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid color(display-p3 1 1 1/0.13);
  border-radius: 12px;
  box-shadow: 0 0 0 0.5px color(display-p3 0 0 0/0.8),
    0 4px 40px 8px color(display-p3 0 0 0/0.4);
  transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1);
  transform: translateZ(0);
  transform-origin: bottom center;
}
.focus-bar_focusBar__HSu4w.focus-bar_isActive__oYgV9 {
  opacity: 1;
  transform: scale(1.5);
  transform-origin: center;
  animation: none;
}
@media (min-width: 768px) {
  .focus-bar_focusBar__HSu4w.focus-bar_isActive__oYgV9 {
    transform: scale(2);
  }
}
.focus-bar_focusBar__HSu4w:hover .focus-bar_restartButton__vI4LJ {
  opacity: 0.7;
  transform: rotate(0);
}
.focus-bar_focusBar__HSu4w:hover .focus-bar_restartButton__vI4LJ:hover {
  opacity: 1;
}
.focus-bar_timer__xA3D_ {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  font-family: var(--monospace-font);
  font-size: 12px;
  background: color(display-p3 1 1 1/0.08);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border: 1px solid var(--controlBackground, color(display-p3 1 1 1/0.1));
  border-radius: 6px;
  transform: translateZ(0);
}
.focus-bar_title__sJ8aQ {
  letter-spacing: -0.1px;
}
.focus-bar_progressBar__3U8ci {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background: color(display-p3 0.349 0.8314 0.6/.15);
}
.focus-bar_restartButton__vI4LJ {
  position: absolute;
  top: 9px;
  right: 5px;
  opacity: 0;
  transition: opacity 0.1s ease-in-out, transform 0.5s var(--spring-1);
  transform: rotate(45deg);
}
.hero-screen_container__CJZup {
  position: relative;
  height: 260px;
  margin-top: 40px;
  margin-bottom: 60px;
}
@media (min-width: 768px) {
  .hero-screen_container__CJZup {
    height: auto;
  }
}
.hero-screen_outerWindowFrame__QjWrz {
  box-sizing: content-box;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  align-items: flex-start;
  width: 1048px;
  padding: var(--spacing-1);
  background: radial-gradient(
      85.77% 49.97% at 51% 5.12%,
      rgba(119, 255, 137, 0.02) 0,
      rgba(174, 255, 174, 0.03) 50%,
      rgba(194, 255, 211, 0.02) 100%
    ),
    rgba(0, 0, 0, 0.44);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  border: 1px solid rgba(150, 255, 178, 0.15);
  border-radius: var(--rounding-lg);
  box-shadow: 0 0 40px 20px hsla(0, 0%, 100%, 0.03),
    inset 0 0.5px 0 0 hsla(0, 0%, 100%, 0.3);
  -webkit-mask-image: linear-gradient(
    180deg,
    #d9d9d9 60%,
    hsla(0, 0%, 85%, 0) 90%
  );
  mask-image: linear-gradient(180deg, #d9d9d9 60%, hsla(0, 0%, 85%, 0) 90%);
  transform: translateZ(0) scale(0.5);
  transform-origin: top center;
}
@media (min-width: 768px) {
  .hero-screen_outerWindowFrame__QjWrz {
    transform: translateZ(0) scale(1);
  }
}
.hero-screen_innerWindowFrame__HYpUA {
  position: relative;
  align-self: stretch;
  height: 477px;
  overflow: hidden;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(12, 13, 15, 0.3),
    rgba(12, 13, 15, 0.3) 1px,
    rgba(7, 8, 10, 0.3) 0,
    rgba(7, 8, 10, 0.3)
  );
  background-size: 3px 3px;
  border: 1px solid hsla(0, 0%, 100%, 0.08);
  border-radius: var(--rounding-md);
  box-shadow: 0 0 2px 0 hsla(0, 0%, 100%, 0.19),
    inset 0 0.5px 0 0 hsla(0, 0%, 100%, 0.1);
}
@media (min-width: 768px) {
  .hero-screen_innerWindowFrame__HYpUA {
    height: 477px;
  }
}
.hero-screen_innerWindowBg__AlZxH {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: var(--rounding-none);
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.hero-screen_editor__bv0S5 {
  position: absolute;
  top: 80px;
  left: 50%;
  width: 600px;
  height: 800px;
  padding: var(--spacing-8) var(--spacing-8);
  font-family: IBM Plex Mono, monospace;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(36px);
  backdrop-filter: blur(36px);
  border: 1px solid hsla(270, 2%, 56%, 0.4);
  border-radius: 12px;
  box-shadow: 0 0 0 0 hsla(0, 0%, 100%, 0.02), 0 0 0 0 hsla(0, 0%, 100%, 0.03),
    inset 0 0.5px 0 0 hsla(0, 0%, 100%, 0.3), 0 0 0 0.5px rgba(0, 0, 0, 0.8),
    0 4px 40px 8px rgba(0, 0, 0, 0.4);
  transition: box-shadow 1.2s ease-out,
    transform 1.2s cubic-bezier(0.115, 0.61, 0.255, 1);
  transform: translateX(-50%) translateY(20px) scale(0.9) translateZ(0);
  transform-origin: center;
}
.hero-screen_editor__bv0S5.hero-screen_editorActive___srGr {
  box-shadow: 0 0 70px 20px hsla(0, 0%, 100%, 0.03),
    0 0 30px 10px hsla(0, 0%, 100%, 0.04),
    inset 0 0.5px 0 0 hsla(0, 0%, 100%, 0.3), 0 0 0 0.5px rgba(0, 0, 0, 0.8),
    0 4px 40px 8px rgba(0, 0, 0, 0.4);
  transform: translateX(-50%) translateY(0) scale(1);
}
.hero-screen_title__FCCAk {
  font-size: 17px;
}
.hero-screen_heading__dUaAw,
.hero-screen_title__FCCAk {
  font-weight: 600;
  line-height: 1.2;
  color: hsla(0, 0%, 100%, 0.9);
}
.hero-screen_heading__dUaAw {
  margin-top: var(--spacing-3);
  font-size: 15px;
}
.hero-screen_description__JDMPq {
  margin-top: var(--spacing-1);
  font-size: 13px;
  line-height: 1.6;
  color: hsla(0, 0%, 100%, 0.8);
}
.hero-screen_cursor__L_Qmr:before {
  color: var(--Grey-200, var(--grey-200));
  content: "|";
  animation: hero-screen_blink__7qNW0 1.1s step-end infinite;
}
@keyframes hero-screen_blink__7qNW0 {
  50% {
    opacity: 0;
  }
}
.hero-screen_window__OwP6K {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 100px;
  min-height: 100px;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(36px);
  backdrop-filter: blur(36px);
  border: 1px solid hsla(270, 2%, 56%, 0.4);
  border-radius: 12px;
  box-shadow: inset 0 0.5px 0 0 hsla(0, 0%, 100%, 0.3),
    0 0 0 0.5px rgba(0, 0, 0, 0.8), 0 4px 40px 8px rgba(0, 0, 0, 0.4);
  transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1),
    opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1),
    filter 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
  transform: translateZ(0);
}
.hero-screen_window__OwP6K.hero-screen_slackWindow__51qbp {
  top: -150px;
  left: 0;
  width: 500px;
  height: 350px;
  transform: scale(0.5);
  transform-origin: bottom right;
}
@media (min-width: 768px) {
  .hero-screen_window__OwP6K.hero-screen_slackWindow__51qbp {
    top: -20px;
    left: -80px;
    transform: scale(1);
  }
}
.hero-screen_window__OwP6K.hero-screen_messagesWindow__Swcf_ {
  top: -140px;
  right: 80px;
  width: 400px;
  height: 250px;
  transform: scale(0.5);
  transform-origin: bottom left;
}
@media (min-width: 768px) {
  .hero-screen_window__OwP6K.hero-screen_messagesWindow__Swcf_ {
    top: 240px;
    right: 30px;
    transform: scale(1);
  }
}
.hero-screen_window__OwP6K.hero-screen_instagramWindow__P9yES {
  top: 20px;
  right: 120px;
  width: 400px;
  height: 250px;
  transform: scale(0.5);
  transform-origin: bottom left;
}
@media (min-width: 768px) {
  .hero-screen_window__OwP6K.hero-screen_instagramWindow__P9yES {
    top: -50px;
    right: -100px;
    transform: scale(1);
  }
}
.hero-screen_window__OwP6K.hero-screen_hidden__Zf4h5 {
  pointer-events: none;
  filter: blur(3px) grayscale(1);
  opacity: 0;
  transform: scale(0.4) translateZ(0);
}
@media (min-width: 768px) {
  .hero-screen_window__OwP6K.hero-screen_hidden__Zf4h5 {
    transform: scale(0.9) translateZ(0);
  }
}
.hero-screen_appIcon__BGhKP {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: #fff;
  border-radius: 10px;
}
.hero-screen_focusBar__Yt5Oe {
  position: absolute;
  bottom: 20px;
  left: 50%;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  opacity: 0;
  transition: transform 0.586s cubic-bezier(0.215, 0.61, 0.355, 1),
    opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
  transform: translateX(-50%) translateY(20px) translateZ(0);
}
@supports (animation-timing-function: linear(0, 1)) {
  .hero-screen_focusBar__Yt5Oe {
    transition: transform 0.586s var(--spring-1),
      opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
}
.hero-screen_focusBar__Yt5Oe.hero-screen_focusBarActive__cre_7 {
  opacity: 1;
  transform: translateX(-50%) translateY(0) translateZ(0);
}
.page_page__k3vnD ::-moz-selection {
  background: #035e40;
}
.page_page__k3vnD ::selection {
  background: #035e40;
}
.page_hero__cowau {
  width: 100%;
  padding-bottom: 150px;
  overflow: hidden;
}
.page_bg__gGG73 {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-mask-image: linear-gradient(180deg, #fff 80%, hsla(0, 0%, 85%, 0));
  mask-image: linear-gradient(180deg, #fff 80%, hsla(0, 0%, 85%, 0));
}
.page_sectionGrid__vYuId {
  margin-top: 48px;
}
.page_startSessionImage__zxG_L {
  margin-left: -40px;
}
@media (min-width: 768px) {
  .page_startSessionImage__zxG_L {
    margin-left: 0;
  }
}
