@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;800&display=swap";@media screen and (min-width: 768px){.app .display{grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(2,min-content);gap:16px}.app .display .timer-info{grid-row:1;grid-column:1/6;align-self:start;justify-self:start}.app .display .colon{display:block}.app .controls{grid-template-columns:repeat(3,1fr);grid-template-rows:1fr;max-width:600px}.app .controls .buttons{grid-row:1;grid-column:2/3}}:root{font-family:Orbitron,sans-serif;font-size:16px}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:0px;color:#e9ecef;background-color:#2a2e34}button{outline:none;border:none}.app{display:grid;grid-template-columns:1fr;grid-template-rows:min-content min-content;align-content:center;gap:48px;width:100%;height:100%}.display{justify-self:center;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:min-content 1fr .6180469716fr;gap:8px;width:min-content;padding:0 24px;font-weight:800}.display .card{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:0px;width:152px;border-radius:16px;background:#343a40;box-shadow:0 2px 8px -2px #121417}.display .card .number{font-size:9em;font-weight:800}.display .colon{display:none;font-size:9em}.display .timer-info{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;grid-column:1/3;text-align:center;color:#e9ecef;letter-spacing:4px}.time-ending{animation-name:halfOpacity;animation-duration:1s;animation-iteration-count:3;animation-timing-function:linear}@keyframes halfOpacity{0%{opacity:1}50%{opacity:.2}to{opacity:1}}.controls{align-self:start;justify-self:center;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;align-items:center;justify-items:center;padding:0 24px;row-gap:16px;width:100%}.controls .buttons{grid-column:1/3;display:grid;grid-template-columns:1fr 1fr;align-items:center;justify-items:center}.stepper{width:124px}.stepper .control{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:0px;width:100%;margin:8px 0 4px}.stepper .control .value{font-size:1.5rem}.stepper .control .icon{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:0px;width:40px;height:40px;font-size:1.5rem;border-radius:20px;color:#e9ecef;background:none;border:none;transition:background-color,color .3s}@media (hover: hover){.stepper .control .icon:hover{cursor:pointer}}.stepper .control .icon:active{color:#5b6d7e;background-color:#23272c}.stepper .label,.stepper .units{text-align:center}.stepper .label{font-size:1rem;letter-spacing:4px}.stepper .units{font-size:.75rem;letter-spacing:2px}.button{width:72px;height:72px;border-radius:36px;color:#2a2e34;background-color:#e9ecef;box-shadow:0 2px 8px -2px #1b2025;transition:background-color,color .3s}@media (hover: hover){.button:hover{cursor:pointer}}.button:active{color:#131518;background-color:#cbd3da}.reset{width:46px;height:46px}