:root{--bg-color-1:#090a0f;--bg-color-2:#141622;--pomodoro-color:#ff5e62;--pomodoro-glow:#ff5e6273;--short-break-color:#00f2fe;--short-break-glow:#00f2fe73;--long-break-color:#a18cd1;--long-break-glow:#a18cd173;--theme-color:var(--pomodoro-color);--theme-glow:var(--pomodoro-glow);--font-sans:"Inter", sans-serif;--font-display:"Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-color-1);color:#f1f3f9;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow-x:hidden}.ambient-background{z-index:-1;background:linear-gradient(135deg, var(--bg-color-1) 0%, var(--bg-color-2) 100%);width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.glow-orb{filter:blur(120px);opacity:.45;mix-blend-mode:screen;border-radius:50%;transition:background 1.5s;position:absolute}.orb-1{background:var(--theme-color);width:400px;height:400px;animation:25s ease-in-out infinite alternate floatOrb1;top:15%;left:15%}.orb-2{background:#3f51b5;width:500px;height:500px;animation:30s ease-in-out infinite alternate floatOrb2;bottom:10%;right:15%}.orb-3{background:#ff007f;width:300px;height:300px;animation:20s ease-in-out infinite alternate floatOrb3;top:60%;left:55%}@keyframes floatOrb1{0%{transform:translate(0)scale(1)}to{transform:translate(120px,80px)scale(1.2)}}@keyframes floatOrb2{0%{transform:translate(0)scale(1)}to{transform:translate(-100px,-120px)scale(.9)}}@keyframes floatOrb3{0%{transform:translate(0)scale(1)}to{transform:translate(80px,-80px)scale(1.1)}}#app{z-index:1;flex-direction:column;gap:30px;width:100%;max-width:480px;padding:20px;display:flex}.timer-container-3d{perspective:1000px;width:100%}.glass-card{-webkit-backdrop-filter:blur(24px)saturate(180%);transform-style:preserve-3d;background:#ffffff0a;border:1px solid #ffffff17;border-radius:28px;padding:35px 25px;transition:border-color 1s,box-shadow .3s;position:relative;overflow:hidden;box-shadow:0 20px 50px #0000004d,inset 0 1px #ffffff26,inset 0 -1px #0003}.main-timer-card{flex-direction:column;align-items:center;width:100%;transition:transform .15s cubic-bezier(.25,1,.5,1),border-color .8s;display:flex;transform:rotateX(0)rotateY(0)}.card-reflection{pointer-events:none;z-index:2;background:radial-gradient(circle at 50% 0,#ffffff26,#0000 70%);width:100%;height:100%;position:absolute;top:0;left:0;transform:translateZ(1px)}.mode-tabs{background:#00000040;border:1px solid #ffffff0d;border-radius:18px;width:100%;margin-bottom:30px;padding:6px;display:flex;transform:translateZ(20px)}.tab-btn{color:#fff9;font-family:var(--font-sans);cursor:pointer;background:0 0;border:none;border-radius:12px;flex:1;padding:10px 12px;font-size:.85rem;font-weight:500;transition:all .3s cubic-bezier(.4,0,.2,1)}.tab-btn:hover{color:#fff}.tab-btn.active{color:var(--theme-color);text-shadow:0 0 8px var(--theme-glow);background:#ffffff14;box-shadow:0 4px 12px #00000026,inset 0 1px #ffffff1a}.timer-display-wrapper{justify-content:center;align-items:center;width:230px;height:230px;margin-bottom:30px;display:flex;position:relative;transform:translateZ(35px)}.timer-ring-svg{filter:drop-shadow(0 8px 16px #0003);width:100%;height:100%;position:absolute;top:0;left:0}.ring-bg{fill:none;stroke:#ffffff08;stroke-width:8px}.ring-progress{fill:none;stroke:var(--theme-color);stroke-width:8px;stroke-linecap:round;transform-origin:50%;filter:drop-shadow(0 0 8px var(--theme-color));transition:stroke-dashoffset .1s linear,stroke 1s;transform:rotate(-90deg)}.timer-text-container{z-index:2;flex-direction:column;align-items:center;display:flex}.timer-countdown{font-family:var(--font-display);letter-spacing:-1px;color:#fff;text-shadow:0 4px 15px #00000040;margin-bottom:4px;font-size:3.2rem;font-weight:800;line-height:1}.timer-status{text-transform:uppercase;letter-spacing:2px;color:#fff6;font-size:.75rem;font-weight:600;transition:color .5s}.timer-controls{align-items:center;gap:20px;margin-bottom:25px;display:flex;transform:translateZ(25px)}.control-btn{color:#fff;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex;box-shadow:0 6px 15px #00000026,inset 0 1px #ffffff1a}.control-btn:hover{background:#ffffff1a;transform:translateY(-2px);box-shadow:0 10px 20px #0003,inset 0 1px #ffffff26}.control-btn:active{transform:translateY(1px);box-shadow:0 2px 8px #0003,inset 0 1px 4px #0006}.play-pause-btn{width:72px;height:72px;color:var(--theme-color);box-shadow:0 10px 25px #00000040, 0 0 15px var(--theme-glow), inset 0 1px 0 #fff3;background:linear-gradient(135deg,#ffffff26 0%,#ffffff08 100%);border:1px solid #fff3;border-radius:50%}.play-pause-btn:hover{box-shadow:0 12px 30px #0000004d, 0 0 25px var(--theme-glow), inset 0 1px 0 #ffffff40;color:#fff;background:linear-gradient(135deg,#fff3 0%,#ffffff0d 100%)}.play-pause-btn:active{box-shadow:0 3px 10px #00000040,inset 0 1px 5px #0006}.reset-btn,.settings-btn{border-radius:50%;width:52px;height:52px}.control-icon{width:24px;height:24px;transition:transform .3s}.play-pause-btn:hover .control-icon{transform:scale(1.1)}.reset-btn:hover .control-icon{transform:rotate(-45deg)}.settings-btn:hover .control-icon{transform:rotate(45deg)}.active-task-container{border-top:1px solid #ffffff0d;flex-direction:column;align-items:center;gap:4px;width:100%;padding-top:15px;display:flex;transform:translateZ(15px)}.active-task-label{text-transform:uppercase;letter-spacing:1.5px;color:#ffffff59;font-size:.65rem}.active-task-text{color:#ffffffd9;text-align:center;word-break:break-all;font-size:.9rem;font-weight:500}.task-manager-card{flex-direction:column;gap:20px;display:flex}.task-manager-card h2{font-family:var(--font-display);letter-spacing:-.5px;font-size:1.4rem;font-weight:600}.task-form{gap:12px;display:flex}#taskInput{color:#fff;font-family:var(--font-sans);background:#0003;border:1px solid #ffffff14;border-radius:14px;outline:none;flex:1;padding:14px 18px;font-size:.9rem;transition:all .3s}#taskInput:focus{border-color:var(--theme-color);box-shadow:0 0 10px var(--theme-glow);background:#0000004d}.add-task-btn{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #ffffff1a;border-radius:14px;justify-content:center;align-items:center;width:50px;height:50px;transition:all .3s;display:flex}.add-task-btn:hover{background:var(--theme-color);border-color:var(--theme-color);box-shadow:0 0 15px var(--theme-glow)}.task-list{flex-direction:column;gap:10px;max-height:250px;padding-right:5px;list-style:none;display:flex;overflow-y:auto}.task-list::-webkit-scrollbar{width:5px}.task-list::-webkit-scrollbar-track{background:0 0}.task-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}.task-list::-webkit-scrollbar-thumb:hover{background:#fff3}.task-item{background:#ffffff05;border:1px solid #ffffff0a;border-radius:14px;justify-content:space-between;align-items:center;padding:12px 16px;transition:all .3s;display:flex}.task-item:hover{background:#ffffff0d;border-color:#ffffff14}.task-item.completed .task-text{opacity:.4;text-decoration:line-through}.task-left-section{flex:1;align-items:center;gap:12px;display:flex}.task-checkbox-wrapper{cursor:pointer;width:20px;height:20px;position:relative}.task-checkbox-wrapper input{opacity:0;width:0;height:0}.checkbox-custom{border:2px solid #ffffff4d;border-radius:6px;width:20px;height:20px;transition:all .2s;position:absolute;top:0;left:0}.task-checkbox-wrapper input:checked~.checkbox-custom{background-color:var(--theme-color);border-color:var(--theme-color);box-shadow:0 0 8px var(--theme-glow)}.task-checkbox-wrapper input:checked~.checkbox-custom:after{content:"";border:2px solid #fff;border-width:0 2px 2px 0;width:5px;height:10px;position:absolute;top:2px;left:6px;transform:rotate(45deg)}.task-text{color:#ffffffe6;word-break:break-all;cursor:pointer;font-size:.9rem}.task-text.active-focus{color:var(--theme-color);font-weight:600}.task-actions{gap:8px;display:flex}.task-action-btn{color:#fff6;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px;transition:all .2s}.task-action-btn:hover{color:#fff;background:#ffffff14}.task-action-btn.delete:hover{color:#ff4a4a;background:#ff4a4a1a}.settings-overlay{-webkit-backdrop-filter:blur(8px);z-index:100;opacity:0;pointer-events:none;background:#00000080;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .4s cubic-bezier(.25,1,.5,1);display:flex;position:fixed;top:0;left:0}.settings-overlay.show{opacity:1;pointer-events:auto}.settings-card{width:100%;max-width:440px;transition:transform .4s cubic-bezier(.25,1,.5,1);transform:scale(.9)translateY(20px)}.settings-overlay.show .settings-card{transform:scale(1)translateY(0)}.settings-header{justify-content:space-between;align-items:center;margin-bottom:25px;display:flex}.settings-header h3{font-family:var(--font-display);font-size:1.3rem;font-weight:600}.close-btn{color:#ffffff80;cursor:pointer;background:0 0;border:none;font-size:1.8rem;line-height:1;transition:color .2s}.close-btn:hover{color:#fff}.settings-body{flex-direction:column;gap:25px;display:flex}.setting-group{flex-direction:column;gap:12px;display:flex}.setting-title{text-transform:uppercase;letter-spacing:1px;color:#fff6;font-size:.8rem;font-weight:600}.time-inputs{gap:15px;display:flex}.input-item{flex-direction:column;flex:1;gap:6px;display:flex}.input-item label{color:#fff9;font-size:.75rem}.input-item input{color:#fff;font-family:var(--font-sans);text-align:center;background:#0003;border:1px solid #ffffff14;border-radius:10px;outline:none;padding:10px;font-size:.9rem}.input-item input:focus{border-color:var(--theme-color);box-shadow:0 0 8px var(--theme-glow)}.setting-group-switches{border-top:1px solid #ffffff0d;flex-direction:column;gap:18px;padding-top:20px;display:flex}.switch-item{justify-content:space-between;align-items:center;display:flex}.switch-info{flex-direction:column;gap:2px;padding-right:15px;display:flex}.switch-label{color:#ffffffe6;font-size:.9rem;font-weight:500}.switch-desc{color:#fff6;font-size:.7rem}.switch-toggle{flex-shrink:0;width:44px;height:24px;display:inline-block;position:relative}.switch-toggle input{opacity:0;width:0;height:0}.switch-slider{cursor:pointer;background-color:#ffffff1a;border:1px solid #ffffff0d;border-radius:34px;transition:all .3s;position:absolute;inset:0}.switch-slider:before{content:"";background-color:#fff;border-radius:50%;width:16px;height:16px;transition:all .3s;position:absolute;bottom:3px;left:3px;box-shadow:0 2px 4px #0003}.switch-toggle input:checked+.switch-slider{background-color:var(--theme-color)}.switch-toggle input:checked+.switch-slider:before{transform:translate(20px)}.settings-footer{justify-content:flex-end;margin-top:30px;display:flex}.settings-save-btn{background:var(--theme-color);color:#fff;font-family:var(--font-sans);cursor:pointer;box-shadow:0 6px 20px var(--theme-glow);border:none;border-radius:12px;padding:12px 24px;font-size:.9rem;font-weight:600;transition:all .3s}.settings-save-btn:hover{box-shadow:0 10px 25px var(--theme-glow);transform:translateY(-2px)}.settings-save-btn:active{transform:translateY(1px)}.particle-field{z-index:0;pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.particle{opacity:0;will-change:transform, opacity;background:radial-gradient(circle,#fffc 0%,#fff0 70%);border-radius:50%;animation:linear infinite particleFloat;position:absolute}@keyframes particleFloat{0%{opacity:0;transform:translateY(100vh)scale(0)}10%{opacity:1}90%{opacity:.6}to{opacity:0;transform:translateY(-10vh)scale(1)}}.ring-progress.is-running{animation:2s ease-in-out infinite ringPulse}@keyframes ringPulse{0%,to{filter:drop-shadow(0 0 8px var(--theme-color))}50%{filter:drop-shadow(0 0 22px var(--theme-color)) drop-shadow(0 0 40px var(--theme-glow))}}.play-pause-btn.is-running{animation:2.5s ease-in-out infinite btnGlow}@keyframes btnGlow{0%,to{box-shadow:0 10px 25px #00000040, 0 0 15px var(--theme-glow), inset 0 1px 0 #fff3}50%{box-shadow:0 10px 25px #00000040, 0 0 35px var(--theme-glow), 0 0 60px var(--theme-glow), inset 0 1px 0 #fff3}}.main-timer-card{animation:8s ease-in-out infinite cardBreath}@keyframes cardBreath{0%,to{box-shadow:0 20px 50px #0000004d,inset 0 1px #ffffff26,inset 0 -1px #0003}50%{box-shadow:0 25px 60px #00000059, 0 0 30px var(--theme-glow), inset 0 1px 0 #fff3, inset 0 -1px 0 #0003}}.celebration-burst{background:radial-gradient(circle, var(--theme-glow), transparent 70%);pointer-events:none;z-index:99;border-radius:50%;width:0;height:0;animation:1.2s ease-out forwards burstExpand;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes burstExpand{0%{opacity:.7;width:0;height:0}60%{opacity:.3;width:200vmax;height:200vmax}to{opacity:0;width:250vmax;height:250vmax}}.glow-orb.orb-1{filter:blur(120px)brightness(1.2)}.glow-orb.orb-2{filter:blur(140px)brightness(1.1)}.glow-orb.orb-3{filter:blur(100px)brightness(1.3)}.tab-btn.active{color:var(--theme-color);box-shadow:0 4px 12px #00000026, 0 0 12px var(--theme-glow), inset 0 1px 0 #ffffff1a;text-shadow:0 0 12px var(--theme-glow);background:#ffffff14}@media (width<=480px){#app{gap:20px;padding:15px}.glass-card{padding:25px 20px}.timer-display-wrapper{width:200px;height:200px}.timer-countdown{font-size:2.8rem}.glow-orb{filter:blur(80px);opacity:.3}}