*{box-sizing:border-box;margin:0;padding:0}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#fff;background-color:#0a0a0a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:100vw;min-height:100vh;overflow:hidden;position:relative}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 80%,rgba(74,144,226,.15) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(139,69,196,.15) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(29,78,216,.1) 0%,transparent 50%);animation:backgroundMove 20s ease-in-out infinite;z-index:-2}body:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle at 25% 25%,rgba(139,69,196,.2) 1px,transparent 1px),radial-gradient(circle at 75% 75%,rgba(74,144,226,.2) 1px,transparent 1px);background-size:60px 60px,40px 40px;animation:particles 30s linear infinite;z-index:-1}@keyframes backgroundMove{0%,to{background:radial-gradient(circle at 20% 80%,rgba(74,144,226,.15) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(139,69,196,.15) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(29,78,216,.1) 0%,transparent 50%)}50%{background:radial-gradient(circle at 80% 20%,rgba(139,69,196,.2) 0%,transparent 50%),radial-gradient(circle at 20% 80%,rgba(74,144,226,.2) 0%,transparent 50%),radial-gradient(circle at 60% 60%,rgba(29,78,216,.15) 0%,transparent 50%)}}@keyframes particles{0%{transform:translateY(0) translate(0)}to{transform:translateY(-100px) translate(50px)}}#root{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column}.timer-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3rem;z-index:10}.timer-display{font-size:6rem;font-weight:800;font-family:Arial Black,Helvetica Neue,Arial,sans-serif;color:#fff;text-shadow:0 0 30px rgba(139,69,196,.5);letter-spacing:.1em;-webkit-user-select:none;user-select:none;transition:all .3s ease}.timer-display.finished{animation:pulse 2s ease-in-out infinite,glow 2s ease-in-out infinite;color:#ff6b6b;text-shadow:0 0 50px rgba(255,107,107,.8)}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes glow{0%,to{text-shadow:0 0 30px rgba(255,107,107,.5)}50%{text-shadow:0 0 50px rgba(255,107,107,1),0 0 70px rgba(255,107,107,.8)}}.timer-input{display:flex;gap:.5rem;align-items:center;margin-bottom:1rem}.time-input{background:#ffffff1a;border:2px solid rgba(139,69,196,.3);border-radius:8px;padding:.5rem;color:#fff;font-size:1.2rem;text-align:center;width:70px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.time-input:focus{outline:none;border-color:#8b45c4cc;box-shadow:0 0 20px #8b45c44d}.time-label{color:#ffffffb3;font-size:.9rem;margin-left:.25rem}.controls{display:flex;gap:1rem;align-items:center}.control-btn{background:linear-gradient(145deg,#8b45c433,#4a90e233);border:2px solid rgba(139,69,196,.5);border-radius:50px;padding:1rem 2rem;color:#fff;font-size:1.1rem;font-weight:500;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;gap:.5rem;min-width:120px;justify-content:center}.control-btn:hover{background:linear-gradient(145deg,#8b45c466,#4a90e266);border-color:#8b45c4cc;box-shadow:0 0 25px #8b45c466;transform:translateY(-2px)}.control-btn:active{transform:translateY(0)}.control-btn.primary{background:linear-gradient(145deg,#4a90e266,#8b45c466);border-color:#4a90e2cc}.control-btn.primary:hover{background:linear-gradient(145deg,#4a90e299,#8b45c499);box-shadow:0 0 30px #4a90e280}.control-btn.danger{background:linear-gradient(145deg,#dc267f33,#ef444433);border-color:#dc267f80}.control-btn.danger:hover{background:linear-gradient(145deg,#dc267f66,#ef444466);border-color:#dc267fcc;box-shadow:0 0 25px #dc267f66}@media (max-width: 768px){.timer-display{font-size:4rem}.controls{flex-direction:column;gap:.75rem}.control-btn{width:100%;max-width:200px}.timer-input{flex-wrap:wrap;justify-content:center}}.app{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}