.track-label[data-v-8296cc00] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-width: var(--min-touch-target);
  min-height: var(--min-touch-target);
  border-radius: 25%;
  padding: 0 10px;
  font-size: var(--label-font-size);
  line-height: var(--label-font-size);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}
@media (hover: hover) {
  .track-label:hover .track-label-text[data-v-8296cc00] {
    scale: 1.1;
  }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .track-label-text[data-v-8296cc00] {
    transition: scale 0.1s ease;
  }
  .track-label:hover .track-label-text[data-v-8296cc00] {
    scale: 1.2;
  }
}
.main-shadow[data-v-0229959b] {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  box-shadow: var(--inner-shadow-small-2);
}
.interaction-shadows[data-v-0229959b] {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  display: flex;
  justify-content: center;
  align-items: center;
}
.interaction-shadows[data-v-0229959b]:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  box-shadow: var(--inner-shadow-small-1);
  opacity: 0;
}
.interaction-shadows[data-v-0229959b]:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  box-shadow: var(--inner-shadow-small-3);
  opacity: 0;
}
@media (hover: hover) {
  .dynamic-shadow-trigger:hover .interaction-shadows[data-v-0229959b]:before {
    opacity: 1;
  }
  .dynamic-shadow-trigger:hover .interaction-shadows[data-v-0229959b]:after {
    opacity: 0;
  }
  .dynamic-shadow-trigger:hover .main-shadow[data-v-0229959b] {
    opacity: 0;
  }
}
.dynamic-shadow-trigger:active .interaction-shadows[data-v-0229959b]:before {
  opacity: 0;
}
.dynamic-shadow-trigger:active .interaction-shadows[data-v-0229959b]:after {
  opacity: 1;
}
.dynamic-shadow-trigger:active .main-shadow[data-v-0229959b] {
  opacity: 0;
}
@media (prefers-reduced-motion: no-preference) {
  .main-shadow[data-v-0229959b],
  .interaction-shadows[data-v-0229959b]:before,
  .interaction-shadows[data-v-0229959b]:after {
    transition: opacity 0.1s ease-in-out;
  }
}
.fullscreen-button[data-v-2f082ea0] {
  width: var(--button-size);
  height: var(--button-size);
  max-width: 100%;
  max-height: 100%;
  background-color: var(--color-background);
  border-radius: var(--button-border-radius);
  outline: none;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.fullscreen-button[data-v-2f082ea0]:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  outline: var(--button-focus-ring-thickness) solid var(--color-focus-ring);
  outline-offset: var(--button-focus-ring-offset);
  opacity: 0;
  scale: var(--scale-1);
}
.fullscreen-button[data-v-2f082ea0]:focus-visible:before {
  opacity: 1;
  scale: none;
}
.fullscreen-icon[data-v-2f082ea0] {
  width: 50%;
  height: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.fullscreen-icon span[data-v-2f082ea0] {
  width: 40%;
  height: 40%;
  position: absolute;
}
.fullscreen-icon span[data-v-2f082ea0]:nth-child(1) {
  border-top: var(--thumb-ring-thickness-2) solid var(--color-text);
  border-left: var(--thumb-ring-thickness-2) solid var(--color-text);
  top: 0;
  left: 0;
}
.fullscreen-icon span[data-v-2f082ea0]:nth-child(2) {
  border-top: var(--thumb-ring-thickness-2) solid var(--color-text);
  border-right: var(--thumb-ring-thickness-2) solid var(--color-text);
  top: 0;
  right: 0;
}
.fullscreen-icon span[data-v-2f082ea0]:nth-child(3) {
  border-bottom: var(--thumb-ring-thickness-2) solid var(--color-text);
  border-left: var(--thumb-ring-thickness-2) solid var(--color-text);
  bottom: 0;
  left: 0;
}
.fullscreen-icon span[data-v-2f082ea0]:nth-child(4) {
  border-bottom: var(--thumb-ring-thickness-2) solid var(--color-text);
  border-right: var(--thumb-ring-thickness-2) solid var(--color-text);
  bottom: 0;
  right: 0;
}
.fullscreen-icon.is-fullscreen span[data-v-2f082ea0]:nth-child(1) {
  translate: 150% 150%;
}
.fullscreen-icon.is-fullscreen span[data-v-2f082ea0]:nth-child(2) {
  translate: -150% 150%;
}
.fullscreen-icon.is-fullscreen span[data-v-2f082ea0]:nth-child(3) {
  translate: 150% -150%;
}
.fullscreen-icon.is-fullscreen span[data-v-2f082ea0]:nth-child(4) {
  translate: -150% -150%;
}
@media (hover: hover) {
  .fullscreen-button:hover .fullscreen-icon[data-v-2f082ea0] {
    scale: var(--scale-1);
  }
}
.fullscreen-button:active .fullscreen-icon[data-v-2f082ea0] {
  scale: var(--scale-3);
}
@media (prefers-reduced-motion: no-preference) {
  .fullscreen-icon[data-v-2f082ea0] {
    transition: scale 0.1s ease-in-out;
  }
  .fullscreen-button[data-v-2f082ea0]:before {
    transition:
      opacity 0.3s ease-in-out,
      scale 0.3s ease-in-out;
  }
  .fullscreen-icon span[data-v-2f082ea0] {
    transition: translate 0.3s ease-in-out 0.3s;
  }
}
@media (display-mode: fullscreen) {
  .no-js-fullscreen[data-v-2f082ea0] {
    visibility: hidden;
    position: absolute;
  }
}
.timer-container[data-v-3d363180] {
  width: var(--timer-diameter);
  height: var(--timer-diameter);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.progress-indicator[data-v-3d363180] {
  background: var(--1725de00);
}
.progress-indicator.outer[data-v-3d363180] {
  width: 100vw;
  height: 100vh;
  position: absolute;
}
.progress-indicator.inner[data-v-3d363180] {
  filter: blur(0.1vmin);
  border-radius: 50%;
  width: 100%;
  height: 100%;
}
.clock-face[data-v-3d363180] {
  background-color: var(--color-background);
  width: var(--scale-outer-diameter);
  height: var(--scale-outer-diameter);
  border-radius: 50%;
  position: absolute;
  box-shadow: var(--inner-shadow-large-2);
  display: flex;
  align-items: center;
  justify-content: center;
}
.clock-face .center[data-v-3d363180] {
  background-color: var(--color-background);
  width: var(--scale-inner-diameter);
  height: var(--scale-inner-diameter);
  border-radius: 50%;
  box-shadow: var(--drop-shadow-2);
  position: absolute;
}
.scale[data-v-3d363180] {
  height: var(--scale-svg-diameter);
  width: var(--scale-svg-diameter);
  position: absolute;
}
.track[data-v-3d363180] {
  width: var(--scale-inner-diameter);
  height: var(--scale-inner-diameter);
  border-radius: 50%;
  position: relative;
}
.thumb[data-v-3d363180] {
  position: absolute;
  width: var(--thumb-diameter);
  height: var(--thumb-diameter);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 50%;
  background-color: var(--color-background);
  transform: var(--78394c79);
  display: flex;
  align-items: center;
  justify-content: center;
}
.thumb .thumb-styling[data-v-3d363180] {
  height: 100%;
  width: 100%;
  border-radius: 50%;
  box-shadow: var(--inner-shadow-small-2);
  outline: var(--thumb-ring-thickness-2) solid var(--color-thumb-ring);
  outline-offset: var(--thumb-ring-offset-2);
  transform: var(--4b018d9b);
}
.thumb[data-v-3d363180]:before {
  content: "";
  width: var(--focus-ring-diameter);
  height: var(--focus-ring-diameter);
  position: absolute;
  border: var(--focus-ring-thickness) solid transparent;
  border-radius: 50%;
  transition: border 0.3s ease-in-out;
}
.thumb.visible-focus[data-v-3d363180]:focus-within {
  outline: var(--thumb-ring-thickness-2) solid transparant;
  outline-offset: calc(var(--thumb-gap) / 2);
}
.thumb.visible-focus[data-v-3d363180]:focus-within:before {
  border: var(--focus-ring-thickness) solid var(--color-focus-ring);
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-radius: 50%;
  scale: 1;
}
.button-container[data-v-3d363180] {
  width: var(--button-container-size);
  height: var(--button-container-size);
  padding: var(--button-container-padding);
  padding-right: calc(2 * var(--button-container-padding));
  padding-bottom: calc(2 * var(--button-container-padding));
  position: absolute;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}
@media (hover: hover) {
  .thumb:hover .thumb-styling[data-v-3d363180],
  .track:hover + .thumb .thumb-styling[data-v-3d363180] {
    box-shadow: var(--inner-shadow-small-1);
    outline: var(--thumb-ring-thickness-1) solid var(--color-thumb-ring);
    outline-offset: var(--thumb-ring-offset-1);
  }
}
.thumb:active .thumb-styling[data-v-3d363180],
.track:active + .thumb .thumb-styling[data-v-3d363180] {
  box-shadow: var(--inner-shadow-small-3);
  outline: var(--thumb-ring-thickness-3) solid var(--color-thumb-ring);
  outline-offset: var(--thumb-ring-offset-3);
}
@media (prefers-reduced-motion: no-preference) {
  .thumb .thumb-styling[data-v-3d363180] {
    transition:
      box-shadow 0.1s ease,
      outline 0.1s ease,
      outline-offset 0.1s ease;
  }
  .thumb[data-v-3d363180]:before {
    border-radius: 25%/50%;
    scale: 1.15;
    transition:
      border 0.3s ease-in-out,
      border-radius 0.3s ease-in-out,
      scale 0.15s ease-in-out 0.15s;
  }
}
:root {
  --white: #ffffff;
  --dark-neutral: #002819;
  --proper-pink: #ff06c1;
  --color-background: var(--white);
  --color-indicator: var(--proper-pink);
  --color-thumb-ring: var(--dark-neutral);
  --color-text: var(--dark-neutral);
  --color-shadow-hsl: 157deg 100% 8%;
  --color-focus-ring: var(--dark-neutral);
  --min-touch-target: 56px;
  --scale-1: 1.1111;
  --scale-3: 0.8611;
}
:root {
  --timer-diameter: 85vmin;
  --timer-diameter: calc(25 / 27 * 100dvmin);
  --thumb-diameter-constrained: var(--min-touch-target);
  --thumb-diameter-ideal: calc(6 / 50 * var(--timer-diameter));
  --thumb-diameter: max(
    var(--thumb-diameter-ideal),
    var(--thumb-diameter-constrained)
  );
  --thumb-gap: calc(var(--thumb-diameter-ideal) / 6);
  --thumb-position: calc(
    -1 / 2 * (var(--timer-diameter) - var(--thumb-diameter))
  );
  --thumb-ring-thickness-2: calc(var(--thumb-diameter) / 32);
  --thumb-ring-thickness-1: calc(10 / 9 * var(--thumb-ring-thickness-2));
  --thumb-ring-thickness-3: calc(31 / 36 * var(--thumb-ring-thickness-2));
  --thumb-ring-offset-2: calc(
    -1 * (var(--thumb-ring-thickness-2) / 2 + var(--thumb-diameter) / 6)
  );
  --thumb-ring-offset-1: calc(1 / 1.25 * var(--thumb-ring-offset-2));
  --thumb-ring-offset-3: calc(1.2 * var(--thumb-ring-offset-2));
  --focus-ring-thickness: calc(var(--thumb-ring-thickness-2) * 2);
  --focus-ring-diameter: calc(
    var(--thumb-diameter) + var(--thumb-gap) + var(--focus-ring-thickness)
  );
  --scale-outer-diameter: calc(
    var(--timer-diameter) - 2 * var(--thumb-diameter) - 2 * var(--thumb-gap)
  );
  --label-font-size-min: 1.5rem;
  --label-font-size-ideal: calc(1 / 18 * var(--scale-outer-diameter));
  --label-font-size: max(
    var(--label-font-size-ideal),
    var(--label-font-size-min)
  );
  --label-breathing-room: calc(1.5 * var(--label-font-size));
  --label-position-constrained: calc(
    -1 / 2 * (var(--scale-outer-diameter) - var(--label-breathing-room))
  );
  --label-position-ideal: calc(-31 / 72 * var(--scale-outer-diameter));
  --label-position: max(
    var(--label-position-ideal),
    var(--label-position-constrained)
  );
  --scale-tick-offset: 0.25rem;
  --scale-inner-diameter-constrained: calc(
    var(--scale-outer-diameter) - 12 / 5 * var(--label-breathing-room) -
      var(--scale-tick-offset)
  );
  --scale-inner-diameter-ideal: calc(
    2 / 3 * var(--scale-outer-diameter) - var(--scale-tick-offset)
  );
  --scale-inner-diameter: min(
    var(--scale-inner-diameter-ideal),
    var(--scale-inner-diameter-constrained)
  );
  --scale-svg-diameter-constrained: calc(
    18 / 13 * var(--scale-outer-diameter) - 36 / 13 *
      var(--label-breathing-room)
  );
  --scale-svg-diameter: min(
    var(--scale-outer-diameter),
    var(--scale-svg-diameter-constrained)
  );
  --button-size: var(--min-touch-target);
  --button-border-radius: 14.2857%;
  --button-container-size-square-viewport: calc(
    (90vmin - var(--timer-diameter) * 0.7071) / 2
  );
  --button-container-size-square-viewport: calc(
    (100dvmin - var(--timer-diameter) * 0.7071) / 2
  );
  --button-container-size-rectangular-viewport: calc(
    (90vmax - var(--timer-diameter)) / 2
  );
  --button-container-size-rectangular-viewport: calc(
    (100dvmax - var(--timer-diameter)) / 2
  );
  --button-container-size: max(
    var(--button-container-size-square-viewport),
    var(--button-container-size-rectangular-viewport)
  );
  --button-container-padding: var(--thumb-gap);
  --button-focus-ring-thickness: calc(var(--button-size) / 16);
  --button-focus-ring-offset: calc(
    (var(--button-container-padding) - var(--button-focus-ring-thickness)) / 2
  );
  --shadow-depth-1: calc(1 / 150 * var(--scale-outer-diameter));
  --shadow-depth-2: calc(1 / 75 * var(--scale-outer-diameter));
  --shadow-depth-3: calc(1 / 40 * var(--scale-outer-diameter));
  --edge-shadow-large: inset 0px calc(-0.15 * var(--shadow-depth-2))
    calc(0.15 * var(--shadow-depth-2)) calc(0.15 * var(--shadow-depth-2))
    hsl(var(--color-shadow-hsl) / 0.15);
  --edge-shadow-small: inset 0px calc(-0.15 * var(--shadow-depth-1))
    calc(0.15 * var(--shadow-depth-1)) calc(0.15 * var(--shadow-depth-1))
    hsl(var(--color-shadow-hsl) / 0.15);
  --drop-shadow-2:
    0px calc(-0.15 * var(--shadow-depth-2)) calc(0.15 * var(--shadow-depth-2))
      calc(0.15 * var(--shadow-depth-2)) hsl(var(--color-shadow-hsl) / 0.15),
    0px calc(0.8 * var(--shadow-depth-2)) calc(0.7 * var(--shadow-depth-2))
      hsl(var(--color-shadow-hsl) / 0.3),
    0px calc(1.5 * var(--shadow-depth-2)) calc(1.4 * var(--shadow-depth-2))
      calc(-1 * var(--shadow-depth-2)) hsl(var(--color-shadow-hsl) / 0.2),
    0px calc(3.4 * var(--shadow-depth-2)) calc(3.1 * var(--shadow-depth-2))
      calc(-2 * var(--shadow-depth-2)) hsl(var(--color-shadow-hsl) / 0.15),
    0px calc(7.9 * var(--shadow-depth-2)) calc(7.1 * var(--shadow-depth-2))
      calc(-4 * var(--shadow-depth-2)) hsl(var(--color-shadow-hsl) / 0.06),
    0px calc(16.5 * var(--shadow-depth-2)) calc(14.9 * var(--shadow-depth-2))
      calc(-6 * var(--shadow-depth-2)) hsl(var(--color-shadow-hsl) / 0.03);
  --inner-shadow-1:
    inset 0px calc(0.8 * var(--shadow-depth-1))
      calc(0.7 * var(--shadow-depth-1)) hsl(var(--color-shadow-hsl) / 0.3),
    inset 0px calc(1.5 * var(--shadow-depth-1))
      calc(1.4 * var(--shadow-depth-1)) calc(-1 * var(--shadow-depth-1))
      hsl(var(--color-shadow-hsl) / 0.2),
    inset 0px calc(3.4 * var(--shadow-depth-1))
      calc(3.1 * var(--shadow-depth-1)) calc(-2 * var(--shadow-depth-1))
      hsl(var(--color-shadow-hsl) / 0.15),
    inset 0px calc(7.9 * var(--shadow-depth-1))
      calc(7.1 * var(--shadow-depth-1)) calc(-4 * var(--shadow-depth-1))
      hsl(var(--color-shadow-hsl) / 0.06),
    inset 0px calc(16.5 * var(--shadow-depth-1))
      calc(14.9 * var(--shadow-depth-1)) calc(-6 * var(--shadow-depth-1))
      hsl(var(--color-shadow-hsl) / 0.03);
  --inner-shadow-2:
    inset 0px calc(0.8 * var(--shadow-depth-2))
      calc(0.7 * var(--shadow-depth-2)) hsl(var(--color-shadow-hsl) / 0.3),
    inset 0px calc(1.5 * var(--shadow-depth-2))
      calc(1.4 * var(--shadow-depth-2)) calc(-1 * var(--shadow-depth-2))
      hsl(var(--color-shadow-hsl) / 0.2),
    inset 0px calc(3.4 * var(--shadow-depth-2))
      calc(3.1 * var(--shadow-depth-2)) calc(-2 * var(--shadow-depth-2))
      hsl(var(--color-shadow-hsl) / 0.15),
    inset 0px calc(7.9 * var(--shadow-depth-2))
      calc(7.1 * var(--shadow-depth-2)) calc(-4 * var(--shadow-depth-2))
      hsl(var(--color-shadow-hsl) / 0.06),
    inset 0px calc(16.5 * var(--shadow-depth-2))
      calc(14.9 * var(--shadow-depth-2)) calc(-6 * var(--shadow-depth-2))
      hsl(var(--color-shadow-hsl) / 0.03);
  --inner-shadow-3:
    inset 0px calc(0.8 * var(--shadow-depth-3))
      calc(0.7 * var(--shadow-depth-3)) hsl(var(--color-shadow-hsl) / 0.3),
    inset 0px calc(1.5 * var(--shadow-depth-3))
      calc(1.4 * var(--shadow-depth-3)) calc(-1 * var(--shadow-depth-3))
      hsl(var(--color-shadow-hsl) / 0.2),
    inset 0px calc(3.4 * var(--shadow-depth-3))
      calc(3.1 * var(--shadow-depth-3)) calc(-2 * var(--shadow-depth-3))
      hsl(var(--color-shadow-hsl) / 0.15),
    inset 0px calc(7.9 * var(--shadow-depth-3))
      calc(7.1 * var(--shadow-depth-3)) calc(-4 * var(--shadow-depth-3))
      hsl(var(--color-shadow-hsl) / 0.06),
    inset 0px calc(16.5 * var(--shadow-depth-3))
      calc(14.9 * var(--shadow-depth-3)) calc(-6 * var(--shadow-depth-3))
      hsl(var(--color-shadow-hsl) / 0.03);
  --inner-shadow-large-2: var(--edge-shadow-large), var(--inner-shadow-2);
  --inner-shadow-small-1: var(--edge-shadow-small), var(--inner-shadow-1);
  --inner-shadow-small-2: var(--edge-shadow-small), var(--inner-shadow-2);
  --inner-shadow-small-3: var(--edge-shadow-small), var(--inner-shadow-3);
}
*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  font-weight: 400;
}
html,
body {
  height: 100%;
  overflow: hidden;
  touch-action: none;
}
button {
  background: none;
  border: none;
  padding: 0;
}
.visually-hidden {
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
body {
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Roboto,
    Oxygen,
    Ubuntu,
    Cantarell,
    Open Sans,
    Helvetica Neue,
    sans-serif;
  text-rendering: optimizeLegibility;
  color: var(--color-text);
}