#titleBar {display: flex;height: 5rem;width: 100%;flex-direction: row;align-items: center;justify-content: space-between;border-radius: 9999px;padding-top: 1rem;padding-bottom: 1rem;padding-left: 1rem;padding-right: 0.5rem
}#appTitleText {margin-left: 0.75rem;cursor: pointer;font-size: 2.25rem;line-height: 2.5rem
}@media (min-width: 640px) {#appTitleText {margin-left: 1rem
    }#appTitleText {font-size: 3rem;line-height: 1
    }
}@media (min-width: 1024px) {#appTitleText {font-size: 3rem;line-height: 1
    }
}#titleBarButtonContainer {display: flex;height: 100%;flex-direction: row;align-items: center;justify-content: center
}.titleBarIcon {margin-left: 0.5rem;margin-right: 0.5rem;height: 1.5rem;width: 1.5rem
}@media (min-width: 640px) {.titleBarIcon {margin-left: 0.75rem;margin-right: 0.75rem
    }.titleBarIcon {height: 1.75rem
    }.titleBarIcon {width: 1.75rem
    }
}@media (min-width: 1024px) {.titleBarIcon {margin-left: 1rem;margin-right: 1rem
    }.titleBarIcon {height: 2.25rem
    }.titleBarIcon {width: 2.25rem
    }
}
.volumeSliderContainer{display:flex;width:100%;flex-direction:row;align-items:center;justify-content:center;max-width:500px}.volumeSlider{height:0.25rem;width:80%;margin-top:auto;margin-bottom:auto}.volumeIcon{margin-right:0.75rem;height:1.75rem;width:1.75rem}#mediaPanel{width:100%;border-radius:1.5rem;margin-left:0.5rem;margin-right:0.5rem;margin-top:0.5rem;display:flex;flex-direction:column;align-items:center;padding-left:0.5rem;padding-right:0.5rem;padding-top:0.5rem;padding-bottom:0.25rem}@media (min-width: 768px){#mediaPanel{flex-direction:row}#mediaPanel{align-items:center}#mediaPanel{justify-content:center}}.mediaPanelSection{margin-left:0.5rem;margin-right:0.5rem;margin-top:0.52rem;margin-bottom:1rem;display:flex;width:100%;flex-direction:column}@media (min-width: 768px){.mediaPanelSection{align-items:center}}.mediaSelectOpenButton{margin-bottom:1rem;height:3.5rem;width:100%;border-radius:1rem;padding:1rem;max-width:500px;display:flex;flex-direction:row;justify-content:center;align-items:center;opacity:.8;box-shadow:0 1rem 2rem rgba(0,0,0,.2);cursor:pointer}.mediaSelectOpenButton:hover{box-shadow:0 .7rem 1.5rem rgba(0,0,0,.3)}.mediaSelectOpenButton:hover .mediaSelectOpenButtonIcon,.mediaSelectOpenButton:hover .mediaSelectOpenButtonText{opacity:1}.mediaSelectOpenButtonIcon{margin-left:0.25rem;margin-right:1rem;height:1.75rem;width:auto;opacity:.8}.mediaSelectOpenButtonText{font-size:1.1rem;font-weight:600;flex:1;opacity:.8;font-family:"Quicksand",sans-serif}.mediaSelectMenu{display:flex;width:100%;flex-direction:column;align-items:center;justify-content:flex-start}@media (min-width: 640px){.mediaSelectMenu{flex-direction:row}.mediaSelectMenu{flex-wrap:wrap}.mediaSelectMenu{align-items:flex-start}.mediaSelectMenu{justify-content:center}}.mediaSelectMenu{overflow-y:auto}.mediaBox{position:relative;cursor:pointer;border-radius:0.75rem;margin-left:0.5rem;margin-right:0.5rem;margin-bottom:2.5rem;height:12rem;width:16rem;padding:0px}@media (min-width: 640px){.mediaBox{margin-left:1.25rem;margin-right:1.25rem}}@media (min-width: 768px){.mediaBox{margin-left:2.5rem;margin-right:2.5rem}}@media (min-width: 1024px){.mediaBox{margin-left:3rem;margin-right:3rem}.mediaBox{height:13rem}.mediaBox{width:18rem}}.mediaBoxDescription{position:absolute;z-index:10;height:100%;width:100%;border-top-left-radius:0.75rem;border-top-right-radius:0.75rem;opacity:0;padding:1.25rem;font-size:1.125rem;line-height:1.75rem}@media (min-width: 1024px){.mediaBoxDescription{font-size:1.25rem;line-height:1.75rem}}.mediaBox:hover .mediaBoxDescription{opacity:100%}.mediaBoxImage{width:100%;border-top-left-radius:0.75rem;border-top-right-radius:0.75rem;background-size:cover;background-position:center;height:9rem}@media (min-width: 1024px){.mediaBoxImage{height:10rem}}.mediaBoxTitle{padding-top:0.5rem;padding-bottom:0.5rem;padding-left:0.5rem;padding-right:0.5rem;font-size:1.25rem;line-height:1.75rem}@media (min-width: 1024px){.mediaBoxTitle{padding-top:0.75rem;padding-bottom:0.75rem}.mediaBoxTitle{padding-left:0.75rem;padding-right:0.75rem}.mediaBoxTitle{font-size:1.5rem;line-height:2rem}}.alarmVolumeControl{display:flex;flex-direction:row;align-items:center;justify-content:center;margin-top:1.75rem;margin-bottom:1.75rem}.alarmVolumeSlider{margin-left:0.5rem;margin-right:0.5rem;height:1.25rem;width:10rem}.alarmMuteButton{cursor:pointer;height:2rem;width:2rem}
.sceneImage{z-index:-2;background-color:#3a3a3a;position:absolute;top:0px;height:100%;width:100%;background-size:cover;background-position:center;background-repeat:no-repeat;-o-object-fit:cover;object-fit:cover}.sceneVideoContainer{z-index:-1;background-color:#3a3a3a;position:absolute;top:0px;height:100vh;width:100vw;overflow:hidden}#sceneVideo{z-index:-1;position:absolute;top:0px;display:block;height:100%;width:100%;-o-object-fit:cover;object-fit:cover}
.timerControlIcon{height:1.5rem;width:auto;cursor:pointer}#timer{width:100%;padding-top:.6rem;padding-bottom:.5rem;display:flex;flex-direction:column;justify-content:center;align-items:center;box-sizing:border-box;border-radius:1.5rem;max-width:48rem;margin-top:4rem}#timerViewControls{width:100%;display:flex;padding-left:1rem;padding-right:.5rem;padding-top:.4rem;flex-direction:row;justify-content:space-between}#timerCloseButton{width:1.5rem;height:1.5rem;margin-top:.4rem;margin-right:.75rem;position:relative}#timerPinHolder{height:3rem;width:3rem;position:relative;top:-0.5rem;left:.15rem;padding-left:.55rem;padding-top:.2rem;margin-left:-0.5rem;border-radius:50%}#timerPinHolder:hover .pin-rotated{transform:rotate(0deg);top:.25rem;transition:.5s;opacity:1}#timerPinButton{height:2rem;width:2rem;position:relative;border-radius:50%}#timerBackButton,#timerSkipButton{width:2.55rem}.pin-rotated{transform:rotate(70deg);top:.25rem;opacity:.7;transition:.5s}.pin-normal{transform:rotate(0deg);top:.5rem;opacity:.7}.pin-normal:hover{opacity:1}#timerTimeDisplay{width:100%;margin-top:-2.6rem;text-align:center;font-size:4.5rem;font-family:"Quicksand",sans-serif;font-weight:lighter;display:flex;justify-content:center}#timerCurrentPhaseDisplay{width:100%;margin-top:-1.3rem;margin-bottom:.9rem;text-align:center;font-size:1.8rem}#timerProgressBarContainer{height:3%;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}#timerProgressBarRange{width:80%;height:.25rem;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;border-radius:1000px}#timerProgressBarBack{width:100%;height:100%;opacity:.5;border-radius:1000px}#timerProgressBar{height:.5rem;margin-top:-0.25rem;border-radius:1000px}#timerBottomBar{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center}#timerControls{width:80%;margin-top:1.25rem;margin-left:10%;margin-bottom:1rem;display:flex;flex-direction:row;justify-content:space-between;align-items:center}#timerSetupMiddle{margin-top:2.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;row-gap:0px;-moz-column-gap:2.5rem;column-gap:2.5rem}@media (min-width: 640px){#timerSetupMiddle{flex-direction:row}}#timerSetupWarning{margin-bottom:2.5rem;display:flex;align-items:center;justify-content:center;font-size:1.25rem;line-height:1.75rem;margin-top:2rem}@media (min-width: 768px){#timerSetupWarning{font-size:1.5rem;line-height:2rem}}#timerSetupWarningIcon{margin-right:1rem;height:2rem;width:auto}#timerSetupBeginButton{font-family:"Bubbler One",sans-serif;margin-top:3.5rem;width:7rem;cursor:pointer;border-radius:0.75rem;padding:0.5rem;font-size:1.5rem;line-height:2rem}@media (min-width: 768px){#timerSetupBeginButton{padding:1rem}#timerSetupBeginButton{font-size:1.875rem;line-height:2.25rem}}.timerLengthAdjuster{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-left:0.5rem;margin-right:0.5rem;margin-top:1.25rem;margin-bottom:1.25rem}.timerLengthAdjusterInputContainer{display:flex;flex-direction:row;align-items:center;justify-content:center;margin-bottom:0.5rem}.timerLengthAdjusterInput{max-width:100px;border-radius:0.75rem;margin-left:0.5rem;margin-right:0.5rem;margin-top:0.5rem;margin-bottom:0.5rem;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:1.25rem;padding-right:1.25rem;font-size:1.25rem;line-height:1.75rem}@media (min-width: 768px){.timerLengthAdjusterInput{font-size:1.5rem;line-height:2rem}}.timerLengthAdjusterUnit{font-size:1.25rem;line-height:1.75rem}@media (min-width: 768px){.timerLengthAdjusterUnit{font-size:1.5rem;line-height:2rem}}.timerLengthAdjusterType{text-transform:capitalize;font-size:1.875rem;line-height:2.25rem}@media (min-width: 768px){.timerLengthAdjusterType{font-size:2.25rem;line-height:2.5rem}}.timerLengthAdjusterInput::-webkit-outer-spin-button,.timerLengthAdjusterInput::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.timerLengthAdjusterInput{-moz-appearance:textfield}.timerLengthAdjusterInput:focus{outline:2px solid #72ce35}
#presetsMenu{padding:.5rem 0 .6rem 0;border-radius:.4rem 1rem 1rem 1rem;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;margin-top:0.19rem;margin-bottom:0.85rem}#sleepPresetMenuButtonIcon,#relaxPresetMenuButtonIcon,#focusPresetMenuButtonIcon{height:4.5rem;width:4.5rem}.presetsMenuButton{display:flex;flex-direction:row;justify-content:left;align-items:center;padding-right:2.5rem;padding-left:.5rem;opacity:.7}.presetsMenuButton:hover{opacity:1;cursor:pointer}.presetsMenuButtonIcon{padding-right:1rem;padding-left:1rem}.presetsMenuButtonText{padding-top:.3rem;font-size:1.7rem}#resumeOption{margin-top:25px}.presetBox{display:flex;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;border-radius:2.5rem;opacity:0.8;margin-top:0.5rem;margin-bottom:1.25rem;height:32rem;width:20rem;padding:1.25rem;margin-left:0.75rem;margin-right:0.75rem}@media (min-width: 768px){.presetBox{padding:1rem}}@media (min-width: 1024px){@media (min-width: 1024px){.presetBox{margin-left:1.5rem;margin-right:1.5rem}}.presetBox{margin-bottom:0px}.presetBox{padding:1.75rem}}.presetBox{opacity:1}.presetBox:hover #moon{transform:translate(0.5rem, -0.8rem) rotate(-9deg)}.presetBox:hover #star-1{transform:translate(-1.7rem, -1.8rem)}.presetBox:hover #star-2{transform:translate(2rem, -2.6rem)}.presetBox:hover #star-3{transform:translate(-1.3rem, -1.9rem)}.presetBox:hover #star-4{transform:translate(2rem, -1.6rem)}.presetBox:hover #star-5{transform:translate(-1.5rem, -1.4rem)}.presetBox:hover #sun{position:relative;transform:translate(0, -4rem)}.presetBox:hover #rocks{position:relative;transform:translate(3rem, 0)}.presetBox:hover #plant{transform:scale(1.1) translate(-8px, -22px)}.presetBox:hover #focus-pin{transform:rotate(-80deg)}.presetBox:hover #pencil{transform:translate(0.5rem, -1rem)}.presetBox:hover #paperclip{transform:rotate(10deg)}@media (min-width: 768px){.presetBoxImage{width:12rem}}@media (min-width: 1024px){.presetBoxImage{height:16rem}.presetBoxImage{width:18rem}}.presetBoxImage{margin-top:4rem;margin-bottom:4rem;overflow:visible}.presetBoxTitle{padding-bottom:0.75rem;font-size:1.875rem;line-height:2.25rem}@media (min-width: 1024px){.presetBoxTitle{font-size:3rem;line-height:1}}.presetBoxTitle{margin-top:auto}#sleepImage{width:42rem}#relaxImage{width:20rem;position:relative}#focusImage{width:11rem}#moon,#star-1,#star-2,#star-3,#star-4,#star-5,#sun,#rocks,#plant,#focus-pin,#pencil,#paperclip{transition:all .5s}
.sidePanel{display:none}@media (min-width: 640px){.sidePanel{display:flex}}.sidePanel{flex-direction:column;z-index:10;width:6rem}#leftPanel{align-items:flex-start}#rightPanel{align-items:flex-end}.mobileControls{position:absolute;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;top:15vh;margin-top:-2vh}.sidePanelButton{margin-bottom:0.75rem;display:flex;height:4.5rem;width:4.5rem;cursor:pointer;align-items:center;justify-content:center;border-radius:1rem}.sidePanelIcon{opacity:.7;margin:0.25rem;height:3rem;width:3rem}.sidePanelButton:hover .sidePanelIcon{opacity:1}#timerSetupButton{padding-left:.35em}#presetsButton{padding:.2em}#presetsButtonContainerPressed{margin-bottom:0px;height:4.3rem;padding-top:0.25rem;border-bottom-left-radius:.4rem;border-bottom-right-radius:.4rem}#mobileControls{display:flex;width:100%;flex-direction:row;justify-content:center;margin-top:1.25rem;margin-bottom:0.5rem;-moz-column-gap:3rem;column-gap:3rem;border-radius:0.75rem;padding-left:1rem;padding-right:1rem;padding-top:0.5rem;padding-bottom:0.5rem}@media (min-width: 640px){#mobileControls{display:none}}.mobileControlIcon{width:5vh;height:5vh;opacity:.7}
#settingsMenu{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin-top:2.5rem}.settingItem{display:flex;height:100%;width:100%;max-width:56rem;flex-direction:row;align-items:center;justify-content:flex-start;padding:0.5rem}@media (min-width: 768px){.settingItem{margin-top:0.5rem;margin-bottom:0.5rem}}.settingItemIcon{margin-right:1rem;height:3rem;width:3rem}@media (min-width: 1024px){.settingItemIcon{margin-right:2rem}.settingItemIcon{height:4rem}.settingItemIcon{width:4rem}}.settingItemLabel{font-size:1.875rem;line-height:2.25rem}@media (min-width: 1024px){.settingItemLabel{font-size:2.25rem;line-height:2.5rem}}.settingContainer{margin-left:0.75rem;display:flex;flex:1 1 0%;align-items:center;justify-content:flex-end}.settingItemSwitch{cursor:pointer;border-radius:0.75rem;text-align:center;padding:0.5rem;font-size:1.5rem;line-height:2rem}@media (min-width: 1024px){.settingItemSwitch{font-size:1.875rem;line-height:2.25rem}}.settingItemSwitch{min-width:80px !important}.settingItemSlider{cursor:pointer;width:100%}@media (min-width: 768px){.settingItemSlider{max-width:20rem}}.settingItemSlider{min-width:80px !important}.settingValueDisplay{position:absolute;bottom:4rem;z-index:10;border-radius:0.75rem;padding-left:1.5rem;padding-right:1.5rem;padding-top:0.5rem;padding-bottom:0.5rem;font-size:2.25rem;line-height:2.5rem}
.confirmation{display:flex;flex-direction:column;justify-content:center;align-items:center}.confirmationChoiceContainer{display:flex;flex-direction:row;justify-content:center;align-items:center}.confirmationMessage{font-size:2rem;margin-bottom:20px}.confirmationChoice{font-size:1.5rem;padding:10px;border-radius:25px;cursor:pointer;text-align:center;min-width:100px;margin-left:25px;margin-right:25px}.loading{z-index:2;height:5rem;width:5rem;position:fixed;bottom:5rem;right:50px}
#aboutMenu{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin-top:2.5rem;max-width:56rem}.about-section-header{display:flex;flex-direction:row;align-items:center;justify-content:center;-moz-column-gap:0.5rem;column-gap:0.5rem;margin-top:0.5rem;margin-bottom:1.25rem;width:100%}@media (min-width: 768px){.about-section-header{-moz-column-gap:1rem;column-gap:1rem}}.about-section-header-icon{height:1.5rem;width:1.5rem}@media (min-width: 768px){.about-section-header-icon{height:1.75rem}.about-section-header-icon{width:1.75rem}}@media (min-width: 1024px){.about-section-header-icon{height:2rem}}@media (min-width: 1536px){.about-section-header-icon{height:2rem}}.about-section-header-text{white-space:nowrap;font-size:1.5rem;line-height:2rem;font-weight:500}@media (min-width: 768px){.about-section-header-text{font-size:1.875rem;line-height:2.25rem}}@media (min-width: 1536px){.about-section-header-text{font-size:2.25rem;line-height:2.5rem}}.about-section-header-text{font-family:"Quicksand",sans-serif}.about-section-header-line{height:0.125rem;flex:1 1 0%;border-radius:0.75rem}.about-section{margin-bottom:0.5rem;display:flex;width:100%;flex-direction:column;align-items:center;justify-content:center}@media (min-width: 1280px){.about-section{margin-bottom:1rem}}.about-horizontal-display{display:flex;width:100%;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:0.5rem;padding:0.5rem}@media (min-width: 768px){.about-horizontal-display{gap:1rem}}@media (min-width: 1536px){.about-horizontal-display{gap:1.25rem}}.about-open-source{display:flex;width:100%;flex-direction:column;flex-wrap:wrap;align-items:center;margin-bottom:1.25rem;row-gap:0.75rem;font-size:1.25rem;line-height:1.75rem}@media (min-width: 768px){.about-open-source{flex-direction:row}.about-open-source{justify-content:space-around}.about-open-source{font-size:1.5rem;line-height:2rem}}@media (min-width: 1536px){.about-open-source{font-size:1.875rem;line-height:2.25rem}}.about-version{width:100%;text-align:center;margin-bottom:0.5rem;font-size:1.25rem;line-height:1.75rem}@media (min-width: 768px){.about-version{font-size:1.5rem;line-height:2rem}}@media (min-width: 1536px){.about-version{font-size:1.875rem;line-height:2.25rem}}.now-playing-item{display:flex;width:100%;flex-direction:row;align-items:center;margin-bottom:1rem;-moz-column-gap:0.5rem;column-gap:0.5rem}@media (min-width: 768px){.now-playing-item{-moz-column-gap:0.75rem;column-gap:0.75rem}}@media (min-width: 1536px){.now-playing-item{-moz-column-gap:1rem;column-gap:1rem}}.now-playing-item-media-icon{height:1.5rem;width:1.5rem}@media (min-width: 768px){.now-playing-item-media-icon{height:1.75rem}.now-playing-item-media-icon{width:1.75rem}}@media (min-width: 1024px){.now-playing-item-media-icon{height:2rem}}@media (min-width: 1536px){.now-playing-item-media-icon{height:2rem}}.now-playing-item-info{display:flex;width:100%;flex-direction:column;align-items:flex-start;justify-content:flex-start}.now-playing-item-media-name{width:100%;font-size:1.25rem;line-height:1.75rem}@media (min-width: 768px){.now-playing-item-media-name{font-size:1.5rem;line-height:2rem}}@media (min-width: 1536px){.now-playing-item-media-name{font-size:1.875rem;line-height:2.25rem}}.now-playing-item-media-name{font-family:"Quicksand",sans-serif;font-weight:400}.now-playing-item-media-source{display:flex;width:100%;flex-direction:row;flex-wrap:wrap;margin-left:0.5rem;font-size:1.25rem;line-height:1.75rem}@media (min-width: 768px){.now-playing-item-media-source{margin-left:0.75rem}.now-playing-item-media-source{font-size:1.5rem;line-height:2rem}}@media (min-width: 1536px){.now-playing-item-media-source{margin-left:1rem}.now-playing-item-media-source{font-size:1.875rem;line-height:2.25rem}}.pretty-link{display:flex;flex-direction:row;align-items:center;opacity:0.8;cursor:pointer}.pretty-link-text{-webkit-text-decoration-line:underline;text-decoration-line:underline}.pretty-link-icon{margin-left:0.25rem;display:inline}.dev-card{display:flex;flex-direction:row;align-items:center;border-radius:0.75rem;-moz-column-gap:0.25rem;column-gap:0.25rem;padding:0.5rem;font-size:1.125rem;line-height:1.75rem}@media (min-width: 768px){.dev-card{-moz-column-gap:0.5rem;column-gap:0.5rem}.dev-card{padding:1rem}.dev-card{font-size:1.25rem;line-height:1.75rem}}@media (min-width: 1536px){.dev-card{-moz-column-gap:1rem;column-gap:1rem}.dev-card{padding:1.5rem}.dev-card{font-size:1.5rem;line-height:2rem}}.dev-card-image{height:2.5rem;width:2.5rem;border-radius:9999px}.dev-card-text{display:flex;height:100%;flex-direction:column;font-weight:500}
#appOverlay{position:absolute;width:auto;height:auto;min-width:100vw;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;-webkit-animation:fadeIn .5s;animation:fadeIn .5s;max-height:100vh;max-width:100vw !important;z-index:20}.overlayCloseButton{position:absolute;top:2.5rem;right:2.5rem;height:2.25rem;width:2.25rem}.overlayContainer{display:flex;width:100%;flex:1 1 0%;flex-direction:column;align-items:center;overflow-y:hidden;padding-top:0.5rem}@media (min-width: 1536px){.overlayContainer{max-width:1536px}}.overlayTitle{font-family:"Quicksand",sans-serif;font-weight:500;padding-right:2.5rem;padding-top:1.25rem;font-size:3rem;line-height:1}@media (min-width: 640px){.overlayTitle{padding-right:0px}}@media (min-width: 1024px){.overlayTitle{font-size:3.75rem;line-height:1}}.overlayContent{margin-top:1.25rem;display:flex;width:100%;flex:1 1 0%;flex-direction:column;align-items:center;justify-content:flex-start;overflow-x:hidden}@media (min-width: 640px){.overlayContent{justify-content:center}}@supports((-webkit-backdrop-filter: blur(2.3vh)) or (backdrop-filter: blur(2.3vh))) or (-webkit-backdrop-filter: blur(2.3vh)){#appOverlay{backdrop-filter:blur(2.3vh);-webkit-backdrop-filter:blur(2.3vh)}}
/*
! tailwindcss v3.0.7 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: currentColor; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
*/

html {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr[title] {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font family by default.
2. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/*
Ensure the default browser behavior of the `hidden` attribute.
*/

[hidden] {
  display: none;
}*, ::before, ::after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity));
  --tw-blur: var(--tw-empty,/*!*/ /*!*/);
  --tw-brightness: var(--tw-empty,/*!*/ /*!*/);
  --tw-contrast: var(--tw-empty,/*!*/ /*!*/);
  --tw-grayscale: var(--tw-empty,/*!*/ /*!*/);
  --tw-hue-rotate: var(--tw-empty,/*!*/ /*!*/);
  --tw-invert: var(--tw-empty,/*!*/ /*!*/);
  --tw-saturate: var(--tw-empty,/*!*/ /*!*/);
  --tw-sepia: var(--tw-empty,/*!*/ /*!*/);
  --tw-drop-shadow: var(--tw-empty,/*!*/ /*!*/);
  --tw-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
  --tw-backdrop-blur: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-brightness: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-contrast: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-grayscale: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-hue-rotate: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-invert: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-opacity: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-saturate: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-sepia: var(--tw-empty,/*!*/ /*!*/);
  --tw-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}.visible {
  visibility: visible;
}.invisible {
  visibility: hidden;
}.static {
  position: static;
}.relative {
  position: relative;
}.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}.mt-2 {
  margin-top: 0.5rem;
}.mb-4 {
  margin-bottom: 1rem;
}.mb-32 {
  margin-bottom: 8rem;
}.mb-5 {
  margin-bottom: 1.25rem;
}.mr-3 {
  margin-right: 0.75rem;
}.flex {
  display: flex;
}.hidden {
  display: none;
}.h-full {
  height: 100%;
}.h-6 {
  height: 1.5rem;
}.w-full {
  width: 100%;
}.w-6 {
  width: 1.5rem;
}.flex-1 {
  flex: 1 1 0%;
}.transform {
  transform: var(--tw-transform);
}.cursor-pointer {
  cursor: pointer;
}.flex-col {
  flex-direction: column;
}.items-center {
  align-items: center;
}.items-stretch {
  align-items: stretch;
}.justify-start {
  justify-content: flex-start;
}.justify-center {
  justify-content: center;
}.justify-between {
  justify-content: space-between;
}.overflow-y-auto {
  overflow-y: auto;
}.overflow-x-hidden {
  overflow-x: hidden;
}.overflow-y-hidden {
  overflow-y: hidden;
}.rounded-xl {
  border-radius: 0.75rem;
}.border {
  border-width: 1px;
}.p-2 {
  padding: 0.5rem;
}.text-left {
  text-align: left;
}.text-right {
  text-align: right;
}.text-6xl {
  font-size: 3.75rem;
  line-height: 1;
}.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}.opacity-0 {
  opacity: 0;
}.outline {
  outline-style: solid;
}.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-filter);
}.invert {
  --tw-invert: invert(100%);
  filter: var(--tw-filter);
}.filter {
  filter: var(--tw-filter);
}.backdrop-filter {
  -webkit-backdrop-filter: var(--tw-backdrop-filter);
          backdrop-filter: var(--tw-backdrop-filter);
}@font-face{font-family:"Bubbler One";src:url(assets/fonts/BubblerOne-Regular.woff2) format("woff2")}@font-face{font-family:"Quicksand",sans-serif;src:url(assets/fonts/Quicksand_Light.woff2) format("woff2")}*, *:before, :after {
  margin: 0px;
  box-sizing: border-box;
  border-width: 0px;
  padding: 0px;
}html, body, #app {
  margin: 0px;
  height: 100%;
  max-height: 100vh;
  width: 100%;
  padding: 0px;
}html {
  overflow: hidden;
}body{font-family:"Bubbler One",sans-serif}::-moz-selection {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}::selection {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}::-moz-selection {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}input[type=range]{background:transparent;-webkit-appearance:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:1.1rem;width:1.1rem;margin-top:-0.4rem;border-radius:50%;background:#fff;box-shadow:1px 1px 2px rgba(0,0,0,.4);cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:.2rem;background:#fff;border-radius:100000px;opacity:.5;-webkit-transition:opacity .4s;transition:opacity .4s;cursor:pointer}input[type=range]:hover::-webkit-slider-runnable-track{opacity:1}input[type=range]::-ms-track{-ms-transition:opacity .4s;transition:opacity .4s;background:transparent;border-color:transparent;color:transparent;cursor:pointer}input[type=range]::-ms-thumb{width:.5rem;height:.5rem;margin-top:-0.25rem;background:#fff;border-radius:50%;box-shadow:1px 1px 2px rgba(0,0,0,.4);cursor:pointer}input[type=range]::-ms-fill-lower{background:#fff;opacity:1}input[type=range]:focus::-ms-fill-lower{background:#fff;opacity:1}input[type=range]::-ms-fill-upper{background:#fff}input[type=range]::-moz-range-thumb{height:1.1rem;width:1.1rem;margin-top:-0.4rem;border-radius:50%;background:#fff;box-shadow:1px 1px 2px rgba(0,0,0,.4);cursor:pointer}input[type=range]::-moz-range-track{height:.2rem;background:#fff;border-radius:100000px;opacity:.5;-moz-transition:opacity .4s;transition:opacity .4s;cursor:pointer}input[type=range]:hover::-moz-range-track{opacity:1}#app {
  margin: 0px;
  display: flex;
  height: 100%;
  max-height: 100vh;
  width: 100%;
  align-items: center;
  justify-content: center;
  padding: 0px;
}#calmeo {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 0.375rem;
}@media (min-width: 640px) {

  #calmeo {
    padding: 0.5rem;
  }
}@media (min-width: 768px) {

  #calmeo {
    padding: 1rem;
  }
}@media (min-width: 1024px) {

  #calmeo {
    padding: 1.25rem;
  }
}#appTop {
  display: flex;
  width: 100%;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  background-image: none;
}#appMiddle {
  margin-top: 0.75rem;
  display: flex;
  height: 100%;
  width: 100%;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
}@media (min-width: 640px) {

  #appMiddle {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}#appCenter {
  display: flex;
  height: 100%;
  flex: 1 1 0%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}@media (min-width: 640px) {

  #appCenter {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }
}#appCenter{max-width:700px}#appBottom {
  display: flex;
  height: 100%;
  width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;max-width:700px;
}#launchMessage{font-family:"Quicksand",sans-serif}.iconButton {
  cursor: pointer;
  opacity: 0.7;
}.iconButton:hover {
  opacity: 1;
}.glassBlock{background:linear-gradient(130deg, rgba(0, 0, 0, 0) 10vh, rgba(255, 255, 255, 0.12) 24vh, rgba(0, 0, 0, 0) 38vh)}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.playFadeOut{-webkit-animation:fadeOut 2s;animation:fadeOut 2s}.playFadeIn{-webkit-animation:fadeIn .5s;animation:fadeIn .5s}.invisible{opacity:0}.visible{opacity:1}::-webkit-scrollbar-track{box-shadow:none}::-webkit-scrollbar-thumb{background:#000;box-shadow:none}::-webkit-scrollbar{background:transparent !important;width:.8em;cursor:default}::-webkit-scrollbar-thumb:window-inactive,::-webkit-scrollbar-thumb{border-radius:5px;cursor:pointer}::-webkit-scrollbar-thumb:window-inactive:hover,::-webkit-scrollbar-thumb:hover{opacity:70}@media screen and (max-width: 640px){::-webkit-scrollbar{-webkit-appearance:none}}.dot-spinner-64x64{-webkit-animation:dot-spinner-64x64 1s steps(12) infinite;animation:dot-spinner-64x64 1s steps(12) infinite;display:block;width:64px;height:64px}@-webkit-keyframes dot-spinner-64x64{from{background-position:0px 0px}to{background-position:0px -768px}}@keyframes dot-spinner-64x64{from{background-position:0px 0px}to{background-position:0px -768px}}@media (min-width: 768px) {

  .md\:my-6 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .md\:mt-4 {
    margin-top: 1rem;
  }

  .md\:mb-10 {
    margin-bottom: 2.5rem;
  }

  .md\:mb-28 {
    margin-bottom: 7rem;
  }

  .md\:mr-4 {
    margin-right: 1rem;
  }

  .md\:h-8 {
    height: 2rem;
  }

  .md\:w-8 {
    width: 2rem;
  }

  .md\:flex-row {
    flex-direction: row;
  }

  .md\:justify-center {
    justify-content: center;
  }

  .md\:overflow-x-hidden {
    overflow-x: hidden;
  }

  .md\:p-4 {
    padding: 1rem;
  }

  .md\:text-7xl {
    font-size: 4.5rem;
    line-height: 1;
  }

  .md\:text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .md\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }

  .md\:text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }

  .md\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}