@import url(https://fonts.googleapis.com/css2?family=Kumbh+Sans:wght@300;400;700&display=swap);@import url(https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400;700&display=swap);@import url(https://fonts.googleapis.com/css2?family=Space+Mono:wght@700&display=swap);body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}*{padding:0;margin:0;box-sizing:border-box}:root{--accent-color:#f87070;--background-body:#1e213f;--text:#d7e0ff;--text-dark:#1e213f;--background-preferences:#fff;--input-background:#eff1fa;--background-timer:#161932;--settings-heading:#161932;--default-accent:#f87070;--blue-accent:#70f3f8;--purple-accent:#d881f8;--font-current:"Kumbh Sans",sans-serif;--font-default:"Kumbh Sans",sans-serif;--font-roboto-slab:"Roboto Slab",serif;--font-space-mono:"Space Mono",monospace}body,html{height:100%}body{display:flex;justify-content:center;background:var(--background-body)}.pomodoro-app{display:flex;flex-direction:column;align-items:center;height:667px;font-family:var(--font-current)}h1{font-family:"Kumbh Sans",sans-serif;color:var(--text);text-align:center;font-style:normal;font-weight:700;font-size:24px;line-height:24px;margin-top:32px}.controls{display:flex;justify-content:space-between;background:var(--background-timer);border-radius:31.5px;width:327px;min-height:63px;padding:8px 6px;margin:45px 0 48px;z-index:100}.controls input[type=radio]{opacity:0;position:fixed;width:0}.controls__button{display:flex;align-items:center;height:48px;border:none;border-radius:26.5px;background:var(--background-timer);padding:0 15px;font-family:var(--font-current);font-style:normal;font-weight:700;font-size:12px;text-align:center;color:var(--text);mix-blend-mode:normal;opacity:.4;cursor:pointer}.controls input[type=radio]:checked+label{color:var(--text-dark);opacity:1;background:var(--accent-color);animation-name:fade;animation-timing-function:ease-in;animation-duration:.05s}.timer{display:flex;justify-content:center;align-items:center;flex-shrink:0;width:300px;height:300px;border-radius:90%;background:linear-gradient(315deg,#2e325a,#0e112a);box-shadow:-50px -50px 100px #272c5a,50px 50px 100px #121530;cursor:pointer}.timer:active{transform:scale(.98)}.timer__display{height:89.26%;width:89.26%;padding:11px;border-radius:90%;background:var(--background-timer)}button.display__mute{width:25px;height:25px;border:0;background-color:initial;color:rgba(215,224,255,.1843137254901961);transition:color .3s ease-in-out;cursor:pointer}button.display__mute:hover{color:#d7e0ff}button:focus:not(:focus-visible){outline:0}.display__start-pause{margin-top:50%;font-family:var(--font-default);font-weight:700;font-size:16px;background-color:var(--background-timer);border:0;color:var(--text);line-height:16px;letter-spacing:15px;margin-right:-15px;transition:transform .2s ease-in-out;cursor:pointer}.pomodoro-app__preferences{margin-top:79px;background:none;border:0;transition:transform .15s ease-in-out;cursor:pointer}.pomodoro-app__preferences:hover{transform:scale(1.4) rotate(45deg)}.preferences{z-index:200;position:fixed;display:none;left:0;top:0;width:100%;height:100%;background-color:#000;background-color:rgba(0,0,0,.4)}@keyframes fade{0%{opacity:0}to{opacity:1%}}.preferences--visible{display:block;animation-name:fade;animation-timing-function:ease-in;animation-duration:.15s}.preferences__pane{top:46px;width:327px;height:549px;background:var(--background-preferences);border-radius:15px;position:relative;margin:auto;box-shadow:0 4px 8px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19);transition:all 3.25s ease-in-out}.preferences__pane h2{padding:24px 0 28px 24px;border-bottom:1px solid #e3e1e1;font-family:var(--font-default);font-style:normal;font-weight:700;font-size:20px;line-height:20px;color:var(--settings-heading)}.pane__close-preferences{border:none;background:none;position:absolute;right:24px;top:19px;color:var(--background-body);opacity:.5;font-size:24px;transition:transform .15s ease-in-out}.pane__close-preferences:hover{transform:scale(1.65);cursor:pointer}h3{width:100%;font-family:var(--font-default);font-style:normal;font-weight:700;font-size:11px;line-height:11px;text-transform:uppercase;text-align:center;letter-spacing:4.23077px;color:var(--settings-heading)}.pane__color-preference,.pane__time-settings{margin-top:28px}.time-settings__form{margin:18px 24px 24px 23px;display:grid;grid-template-columns:50% 50%;align-items:center;grid-row-gap:8px;row-gap:8px}label{font-family:var(--font-default);font-size:12px;line-height:12px;mix-blend-mode:normal;opacity:.4}input,label{font-style:normal;font-weight:700;color:var(--text-dark)}input{width:140px;height:40px;padding-left:16px;border:none;border-radius:10px;background:var(--input-background);font-family:var();font-size:14px;line-height:14px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{margin-right:16px;-webkit-appearance:none;background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 6l6-4 6 4M1 15l6 4 6-4' stroke='%231E213F' stroke-opacity='.25' stroke-width='2'/%3E%3C/svg%3E") no-repeat 50%;height:21px;width:14px;opacity:.5;cursor:pointer}input[type=number]::-webkit-inner-spin-button:active,input[type=number]::-webkit-inner-spin-button:hover{opacity:1}.pane__color-preference input[type=radio],.pane__font-preference input[type=radio]{opacity:0;position:fixed;width:0}.pane__color-preference input[type=radio]+label,.pane__font-preference input[type=radio]+label{opacity:1;display:flex;justify-content:center;align-items:center;transition:transform .25s ease-in-out,background-color .25s ease-in-out;cursor:pointer}.pane__color-preference input[type=radio]+label:hover,.pane__font-preference input[type=radio]+label:hover{transform:scale(1.1)}.pane__color-preference,.pane__font-preference{display:flex;flex-wrap:wrap;justify-content:center;padding:24px 0;margin:0 24px;border-color:#e3e1e1;border-style:solid;border-width:1px 0}.pane__color-preference{border:none}.color-preference__blue,.color-preference__default,.color-preference__purple,.font-preference__kumbh,.font-preference__roboto,.font-preference__space{width:40px;height:40px;margin:18px 8px 0;border:none;border-radius:90%;font-size:15px}.font-preference__kumbh,.font-preference__roboto,.font-preference__space{background:var(--input-background);color:var(--text-dark)}.pane__font-preference input[type=radio]:checked+label{background:var(--settings-heading);color:#fff}.pane__font-preference input[type=radio]:hover+label{background:var(--settings-heading);color:#fff;opacity:.9}.font-preference__kumbh{font-family:var(--font-default);font-weight:700;padding-top:5px}.font-preference__roboto{font-family:var(--font-roboto-slab);font-weight:400}.font-preference__space{font-family:var(--font-space-mono);font-weight:700}.color-preference__default{background-color:var(--default-accent)}.color-preference__blue{background-color:var(--blue-accent)}.color-preference__purple{background-color:var(--purple-accent)}.pane__color-preference input[type=radio]:checked+label,.pane__color-preference input[type=radio]:hover+label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='15' height='11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 5.5l3.953 3.953L13.405 1' stroke='%23161932' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:50%}.pane__apply-row{width:100%;display:flex;justify-content:center}.pane__apply-preferences{width:140px;height:53px;margin-top:36px;padding:0;border-radius:26.5px;background-color:var(--default-accent);font-family:Kumbh Sans;font-weight:700;font-size:16px;color:#fff;transition:transform .15s ease-in-out;cursor:pointer}.pane__apply-preferences:hover{transform:scale(1.1)}@media screen and (min-width:600px){h1{font-size:32px;line-height:32px;margin-top:48px}.pomodoro-app{height:100%}.controls{width:373px;margin:55px 0 45px}.controls__button{font-size:14px}.timer{width:410px;height:410px}.pane__close-preferences{right:36px;top:39px;font-size:28px}.preferences__pane{top:267px;width:540px;height:490px;border-radius:25px}.preferences__pane h2{padding:34px 0 31px 40px;font-size:28px;line-height:28px}.time-settings__form{margin:24px 40px}.pane__color-preference,.pane__font-preference{margin:0 40px}.pane__time-settings h3{margin:24px 40px 22px}.pane__color-preference h3,.pane__font-preference h3,.pane__time-settings h3{text-align:left;font-size:13px;line-height:13px;letter-spacing:5px}.pane__color-preference h3,.pane__font-preference h3{width:300px;margin-top:18px}.color-preference__blue,.color-preference__default,.color-preference__purple,.font-preference__kumbh,.font-preference__roboto,.font-preference__space{margin:0 8px}.color-preference__purple,.font-preference__space{margin:0 0 0 8px}.time-settings__form{margin:18px 40px 24px;display:grid;grid-template-columns:auto auto auto;grid-template-rows:12px 48px;grid-column-gap:22px;column-gap:22px}label{grid-row:1}input{grid-row:2}}@media screen and (min-width:769px){.preferences__pane{top:155px}}
/*# sourceMappingURL=main.ef6431e2.chunk.css.map */