@import"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap";.flex-container{display:flex;text-align:center;flex-direction:column;justify-content:center;gap:16px;height:100%}:root{--font-family: "Open Sans", system-ui, sans-serif;--border-radius: 25px;--background: #26273d;--progress-bg: #545576;--progress-fg: #67cb88;--progress-fg-complete: #cb6767;--foreground: #a2a4cb;--header: #FFF;--btn-outline: #606170}.timer h1,.timer h4{margin:0;font-weight:initial;font-family:var(--font-family)}.timer{padding:40px;color:var(--foreground);background-color:var(--background);border-radius:var(--border-radius)}.timer-progress .content>*:nth-child(2){color:#fff}.timer-buttons{display:flex;gap:8px;margin-top:20px}.timer-buttons>button{all:unset;padding:8px 15px;border:1px solid var(--btn-outline);border-radius:var(--border-radius);font-family:var(--font-family)}.timer-buttons>button:active{color:var(--foreground)}.timer-buttons>button:disabled{color:gray;border-color:gray;cursor:not-allowed}.timer-buttons>button:hover:not(:disabled){border-color:var(--header)}@keyframes colorChange{0%{stroke:var(--progress-fg)}30%,50%,70%{stroke:var(--progress-fg-complete)}to{stroke:var(--progress-fg)}}.circular-progress-bar{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative}.content{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;top:0;left:0}.progress-circle-bg{stroke:var(--progress-bg)}.progress-circle-fg{stroke:var(--progress-fg);transition:stroke-dashoffset .35s ease}.progress-circle-anim{animation:colorChange 2s linear infinite}:root{font-family:system-ui,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0}#root{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh}