body[data-theme=dark]{--body-bg:#2a2d3e;--text-color:#e0e0e0;--container-bg:#3b3f55}body[data-theme=light]{--body-bg:#fff;--text-color:#333;--container-bg:#f0f0f0}body{background-color:var(--body-bg);color:var(--text-color);font-family:Abel,Arial,sans-serif;height:100vh;justify-content:center;margin:0;transition:all .4s ease}body,header{align-items:center;display:flex}header{padding:10px 20px}.container{background-color:var(--container-bg);border-radius:8px;padding:30px 20px;position:relative;text-align:center;transition:all .4s ease;width:300px}@property --angle{syntax:"<angle>";initial-value:0deg;inherits:false}.container:after,.container:before{--angle:0deg;animation:spin 3s linear infinite;background-image:conic-gradient(from var(--angle),#57b846 25%,#00c1d4 50%,#e76e55 75%,#57b846 100%);border-radius:8px;content:"";height:100%;left:50%;padding:2px;position:absolute;top:50%;translate:-50% -50%;width:100%;z-index:-1}.container:before{filter:blur(1.5rem);opacity:.5}@keyframes spin{0%{--angle:0deg}to{--angle:360deg}}.counter-text{color:var(--text-color);font-size:28px;font-weight:700;margin-bottom:25px}.counter{font-family:Roboto Mono;font-weight:200}button{border:none;border-radius:6px;color:#f5f5f5;cursor:pointer;font-size:16px;font-weight:700;margin:8px 0;padding:12px;transition:background-color .3s ease;width:100%}.increment-btn{background-color:#57b846}.increment-btn:hover{background-color:#4aa93d}.decrement-btn{background-color:#e76e55}.decrement-btn:hover{background-color:#d85f4b}
/*# sourceMappingURL=main.918ece93.css.map*/