@charset "UTF-8";*,*:before,*:after{box-sizing:border-box;padding:0;margin:0}:root{--font-main: "Kumbh Sans", sans-serif;--main-color: #F87070;--faded-blue: #D7E0FF;--dark-blue-shade-1: #1E213F;--dark-blue-shade-2: #161932;--white: #fff;--off-white: #EFF1FA;--bg-color: red }.kumbh-theme{--font-main: "Kumbh Sans", sans-serif}.kumbh-theme h1{font-weight:700;letter-spacing:-5px}.roboto-theme{--font-main: "Roboto Slab", serif}.roboto-theme h1{font-weight:700}.space-theme{--font-main: "Space Mono", monospace}.space-theme h1{font-weight:400;letter-spacing:-10px}body{font-family:var(--font-main)}html,body{height:100%;overflow-x:hidden}input,button,textarea,select{font:inherit;color:inherit}button,a{border:none;background:none;cursor:pointer}*:disabled{cursor:not-allowed}button:has(svg){line-height:0}a{color:inherit;text-decoration:none}ul,menu{list-style:none}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}.disabled{opacity:.3}.time-section__item{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px}@media only screen and (max-width: 451px){.time-section__item{flex-direction:row;justify-content:space-between;align-items:center;gap:0px}}.time-section__item label{color:#1e213f;font-size:12px;font-style:normal;font-weight:700;line-height:normal;opacity:.4}@media only screen and (max-width: 451px){.time-section__item label{width:100%}}.input-container{position:relative;display:flex;align-items:center;gap:4px;background:#eff1fa;border-radius:10px;padding-right:16px}.input-container:hover .control-btn{color:#1e213f}.input-container input{width:100%;height:100%;background:#eff1fa;border:none;outline:none;padding:16px 0 16px 16px;color:#1e213f;font-size:14px;font-style:normal;font-weight:700;line-height:normal;border-radius:10px}.input-container input::-webkit-outer-spin-button,.input-container input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.error-display{position:absolute;bottom:-1px;left:0;color:red;font-size:9px;transform:translateY(100%)}.controllers{display:flex;flex-direction:column}.control-btn{color:#1e213f40;width:12px}.timer-container{width:410px;height:410px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:410px;background:linear-gradient(315deg,#2e325a,#0e112a);box-shadow:50px 50px 100px #121530,-50px -50px 100px #272c5a;margin-bottom:63px}@media only screen and (max-width: 451px){.timer-container{max-width:300px;height:300px;border-radius:300px}}.outer{max-width:366px;height:366px;display:flex;align-items:center;justify-content:start;border-radius:366px;background:#161932;position:relative}@media only screen and (max-width: 451px){.outer{width:267.805px;height:267.805px;border-radius:267.805px}}.timer-content{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute}.time{color:#d7e0ff;text-align:center;font-size:100px;font-style:normal;line-height:normal;margin-top:50px}@media only screen and (max-width: 451px){.time{font-size:80px}}.time-controller{display:flex;align-items:center;justify-content:center;position:relative;color:#d7e0ff;font-size:16px;font-style:normal;font-weight:700;line-height:normal;letter-spacing:15px;margin-right:-19px;width:auto;text-align:center}@media only screen and (max-width: 451px){.time-controller{font-size:14px;letter-spacing:13.125px;margin-right:-17.125px}}.svg-circle-progress{fill:none;stroke:var(--main-color);stroke-linecap:round;stroke-linejoin:round}.restart-timer-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:7px;border-radius:50%;border:1px solid rgba(255,255,255,.1647058824);background:#d7e0ff23;margin-top:7px;color:#ffffff8e}@media only screen and (max-width: 451px){.restart-timer-btn{padding:5px;font-size:13px}}.bell-container{position:fixed;top:20px;right:20px;width:110px;height:110px;background:#161932;border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center}@media only screen and (max-width: 451px){.bell-container{width:90px;height:90px;border-radius:9px}}.bell-icon{font-size:40px;color:#d7e0ff}@media only screen and (max-width: 451px){.bell-icon{font-size:33px}}.close-icon{font-size:25px;color:var(--main-color)}@media only screen and (max-width: 451px){.close-icon{font-size:20px}}.App{display:flex;flex-direction:column;align-items:center;width:100vw;height:100vh;padding:30px;justify-content:center;background:#1e213f}@media only screen and (max-width: 650px){.App{padding:15px 24px 0}}.title{color:#d7e0ff;text-align:center;font-size:32px;font-style:normal;font-weight:700;line-height:normal;width:100%;margin-bottom:55px}.switch{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr;position:relative;border-radius:31.5px;background:#161932;width:373px;height:63px;flex-shrink:0;align-items:center;padding:9px;margin-bottom:45px}@media only screen and (max-width: 451px){.switch{width:327px}}.switch-active-bg{width:120px;height:48px;display:flex;border-radius:26.5px;background:var(--main-color);position:absolute;margin-left:9px}@media only screen and (max-width: 451px){.switch-active-bg{width:105.201px}}.switch-tab{height:100%;flex-shrink:0;border-radius:26.5px;display:flex;align-items:center;justify-content:center;z-index:5;color:#d7e0ff;opacity:.4;font-size:14px;font-style:normal;font-weight:700;line-height:normal}.switch-tab:hover{opacity:1}.switch-tab--active{color:#1e213f;opacity:1}@media only screen and (max-width: 451px){.switch-tab{font-size:12px}}.settings{font-size:28px;color:#d7e0ff;opacity:.4}.settings:hover{opacity:1}.font-section{display:flex;align-items:center;justify-content:space-between;padding:16px 0;margin:16px 0;border-top:1px solid #E3E1E1;border-bottom:1px solid #E3E1E1}@media only screen and (max-width: 451px){.font-section{flex-direction:column;gap:18px}}.font-section h3{color:#161932;font-size:13px;font-style:normal;font-weight:700;line-height:normal;letter-spacing:5px}@media only screen and (max-width: 451px){.font-section h3{font-size:11px}}.font-selector{display:flex;gap:16px}.font-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;background:#eff1fa;border-radius:50%;color:#1e213f;font-size:15px;font-style:normal;font-weight:700;line-height:normal}.font-btn:hover{outline:1px solid #EFF1FA;outline-offset:4px}.font-btn--active{background:#161932;color:#fff}.font-btn--kumbh{font-family:Kumbh Sans,sans-serif}.font-btn--roboto{font-family:Roboto,sans-serif;font-weight:400}.font-btn--space{font-family:Space Mono,monospace}.color-section{display:flex;align-items:center;justify-content:space-between}@media only screen and (max-width: 451px){.color-section{flex-direction:column;gap:18px}}.color-section h3{color:#161932;font-size:13px;font-style:normal;font-weight:700;line-height:normal;letter-spacing:5px}@media only screen and (max-width: 451px){.color-section h3{font-size:11px}}.color-selector{display:flex;gap:16px}.color-btn{display:flex;align-items:center;justify-content:center;background-color:var(--bg-color);width:40px;height:40px;flex-shrink:0;border-radius:50%}.color-btn:hover{filter:grayscale(.2) brightness(1.2)}.color-btn--active span{font-size:20px}.modal{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:540px;flex-shrink:0;background:transparent;border:none;display:flex;flex-direction:column;align-items:center}.modal-box{position:relative;border-radius:25px;background:#fff}.modal::backdrop{background:#0a0c1c80}.modal__top{display:flex;justify-content:space-between;align-items:center;padding:34px 38px 31px 40px;border-bottom:1px solid #E3E1E1}@media only screen and (max-width: 451px){.modal__top{padding:24px}}.modal__top h2{color:#161932;font-size:28px;font-style:normal;font-weight:700;line-height:normal}@media only screen and (max-width: 451px){.modal__top h2{font-size:20px}}.modal__top__close img{width:14px;height:14px;flex-shrink:0;opacity:.5}.modal__content{padding:28px 38px 59px 40px;display:flex;flex-direction:column}@media only screen and (max-width: 451px){.modal__content{padding:24px 24px 40px}}.time-section{display:flex;flex-direction:column;gap:22px}@media only screen and (max-width: 451px){.time-section{align-items:center}}.time-section h3{color:#161932;font-size:13px;font-style:normal;font-weight:700;line-height:normal;letter-spacing:5px}@media only screen and (max-width: 451px){.time-section h3{font-size:11px}}.time-section__content{display:flex;justify-content:space-between;align-items:center;gap:21px}@media only screen and (max-width: 451px){.time-section__content{flex-direction:column;gap:16px}}.apply-btn{color:#fff;text-align:center;font-size:16px;font-style:normal;font-weight:700;line-height:normal;width:140px;height:53px;flex-shrink:0;border-radius:26.5px;background:var(--main-color);transform:translateY(-50%)}.apply-btn:hover{filter:grayscale(.2) brightness(1.2)}