.mode-selector-container{display:flex;justify-content:center;margin-bottom:1rem}.mode-selector-group{background-color:var(--background);border-radius:.5rem;padding:.25rem;display:flex;font-size:.875rem;border:1px solid var(--border-color);transition:all .3s ease}.mode-selector-button{padding:.25rem .75rem;border-radius:.375rem;font-weight:500;border:none;cursor:pointer;background-color:transparent;color:var(--text-secondary);transition:all .2s ease}.mode-selector-button:hover:not(:disabled){color:var(--text);background-color:var(--hover-color)}.mode-selector-button.active{background-color:#ef4444;color:white}.mode-selector-button:disabled{opacity:.5;cursor:not-allowed}.control-buttons-container{display:flex;justify-content:center;gap:.75rem;margin-bottom:1rem}.control-button{display:flex;align-items:center;font-weight:500;padding:.75rem 1.5rem;border-radius:.5rem;border:none;cursor:pointer;transition:all .2s ease;color:white}.control-button:disabled{background-color:var(--completed-color)!important;cursor:not-allowed;opacity:.6}.control-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 8px var(--shadow-color)}.start-button{background-color:#ef4444}.start-button:hover:not(:disabled){background-color:#dc2626}.resume-button{background-color:#10b981}.resume-button:hover:not(:disabled){background-color:#059669}.pause-button{background-color:#f59e0b}.pause-button:hover:not(:disabled){background-color:#d97706}.reset-button{background-color:var(--text-secondary)}.reset-button:hover:not(:disabled){background-color:var(--text)}.timer-display-container{position:relative;margin-bottom:1.5rem;display:flex;justify-content:center}.timer-circle-svg{width:12rem;height:12rem;transform:rotate(-90deg)}.timer-background-circle{stroke:var(--border-color);transition:stroke .3s ease}.timer-progress-circle{stroke:#ef4444;transition:all ease-linear 1s}.timer-progress-circle.active{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.timer-warning-circle{stroke:#f59e0b;animation:spin 3s linear infinite}.timer-content-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.timer-content-center{text-align:center}.timer-time-display{font-size:2.25rem;font-weight:700;margin-bottom:.25rem;color:var(--text);transition:color .3s ease}.timer-time-display.final-stretch{color:#f59e0b;animation:pulse 1s cubic-bezier(.4,0,.6,1) infinite}.timer-mode-label{font-size:.875rem;color:var(--text-secondary);transition:color .3s ease}.timer-final-stretch-message{font-size:.75rem;color:#f59e0b;font-weight:500;margin-top:.25rem}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (max-width:768px){.timer-circle-svg{width:10rem;height:10rem}.timer-time-display{font-size:2rem}}.session-list-container{background-color:var(--background-secondary);border-radius:.5rem;padding:1.5rem;transition:all .3s ease}.session-list-title{font-size:1.125rem;font-weight:600;margin-bottom:1rem;color:var(--text);transition:color .3s ease}.session-list-items{display:flex;flex-direction:column;gap:.75rem;max-height:16rem;overflow-y:auto}.session-item{display:flex;justify-content:space-between;align-items:center;background-color:var(--background);border-radius:.5rem;padding:.75rem 1rem;border:1px solid var(--border-color);transition:all .3s ease}.session-item:hover{transform:translateY(-1px);box-shadow:0 2px 8px var(--shadow-color)}.session-task-name{font-weight:500;color:var(--text);transition:color .3s ease}.session-mode{font-size:.875rem;color:var(--text-secondary);transition:color .3s ease}.session-details{text-align:right}.session-duration{font-size:.875rem;font-weight:500}.session-duration.text-green-400{color:#10b981}.session-duration.text-orange-400{color:#f97316}.session-time{font-size:.75rem;color:var(--text-secondary);transition:color .3s ease}.session-status{font-size:.75rem;color:#f97316}.pomodoro-container{min-height:calc(100vh - 3.5rem);padding:1rem;background-color:var(--background);color:var(--text);transition:background-color .3s ease,color .3s ease}.pomodoro-title{font-size:1.875rem;font-weight:700;margin-bottom:.5rem;color:var(--text);transition:color .3s ease}.pomodoro-subtitle{color:var(--text-secondary);transition:color .3s ease}.pomodoro-error{margin-bottom:1rem;padding:.75rem;border-radius:.375rem;background-color:var(--background-secondary);border:1px solid #ef4444;color:#ef4444;transition:all .3s ease}.pomodoro-signin-container{text-align:center;padding:2rem;max-width:28rem;margin:0 auto;border-radius:.5rem;color:var(--text)}.pomodoro-signin-container,.pomodoro-timer-container{box-shadow:0 10px 25px var(--shadow-color);background-color:var(--background-secondary);transition:all .3s ease}.pomodoro-timer-container{border-radius:1rem;padding:1.5rem;margin-bottom:2rem}.pomodoro-selected-task{margin-bottom:1rem;padding:.75rem;border-radius:.5rem;text-align:center;background-color:var(--background);border:1px solid var(--primary);transition:all .3s ease}.pomodoro-task-label{font-size:.75rem;color:var(--primary);transition:color .3s ease}.pomodoro-task-title{font-size:.875rem;font-weight:500;color:var(--text);transition:color .3s ease}.pomodoro-task-focus{font-size:.75rem;margin-top:.25rem;color:var(--primary);transition:color .3s ease}.pomodoro-debug-info{margin-top:1rem;padding:.5rem;border-radius:.375rem;font-size:.75rem;background-color:var(--background);color:var(--text-secondary);border:1px solid var(--border-color);transition:all .3s ease}.pomodoro-notification-settings{display:flex;justify-content:space-between;align-items:center;font-size:.875rem;padding-top:1rem;border-top:1px solid var(--border-color);transition:border-color .3s ease}.pomodoro-setting-label{color:var(--text);transition:color .3s ease}.pomodoro-checkbox{accent-color:var(--primary)}.pomodoro-test-button{font-size:.75rem;padding:.25rem .75rem;border-radius:.375rem;color:white;background-color:var(--primary);border:none;cursor:pointer;transition:all .2s ease}.pomodoro-test-button:hover{opacity:.9;transform:translateY(-1px)}.pomodoro-task-selection{border-radius:.5rem;padding:1.5rem;background-color:var(--background-secondary);transition:all .3s ease}.pomodoro-section-title{font-size:1.125rem;font-weight:600;margin-bottom:1rem;color:var(--text);transition:color .3s ease}.pomodoro-date-input{width:100%;border-radius:.5rem;padding:.5rem .75rem;font-size:.875rem;background-color:var(--background);color:var(--text);border:1px solid var(--border-color);transition:all .3s ease}.pomodoro-date-input:focus{outline:none;ring:2px solid var(--primary);border-color:var(--primary)}.pomodoro-clear-button{width:100%;padding:.5rem .75rem;border-radius:.5rem;font-size:.875rem;background-color:var(--background);color:var(--text);border:1px solid var(--border-color);cursor:pointer;transition:all .2s ease}.pomodoro-clear-button:hover{background-color:var(--hover-color);transform:translateY(-1px);box-shadow:0 2px 8px var(--shadow-color)}.pomodoro-no-tasks{font-size:.875rem;text-align:center;padding:1rem;color:var(--text-secondary);transition:color .3s ease}.pomodoro-task-button{width:100%;text-align:left;padding:.75rem;border-radius:.5rem;cursor:pointer;background-color:var(--background);color:var(--text);border:1px solid var(--border-color);transition:all .2s ease}.pomodoro-task-button:hover{transform:translateY(-1px);box-shadow:0 2px 8px var(--shadow-color)}.pomodoro-task-button.selected{background-color:var(--primary);color:white;border:none}.pomodoro-task-button.active{background-color:#f97316;color:white;border:none}.pomodoro-task-time{font-size:.75rem;opacity:.75;margin-top:.25rem;color:inherit}.pomodoro-info-section,.pomodoro-tips-section{border-radius:.5rem;padding:1.5rem;background-color:var(--background-secondary);transition:all .3s ease}.pomodoro-info-title{color:var(--text);transition:color .3s ease}.pomodoro-info-description{color:var(--text-secondary);transition:color .3s ease}.pomodoro-tips-list{color:var(--text);transition:color .3s ease}.pomodoro-container input[type=checkbox],.pomodoro-container input[type=date]{background-color:var(--background)!important;color:var(--text)!important;border:1px solid var(--border-color)!important}.pomodoro-container input[type=date]:focus{outline:none!important;border-color:var(--primary)!important;box-shadow:0 0 0 2px rgba(74,111,165,.2)!important}.pomodoro-container button:hover{opacity:.9;transform:translateY(-1px);transition:all .2s ease}@media (max-width:768px){.pomodoro-container{padding:.5rem}.pomodoro-title{font-size:1.5rem}.pomodoro-info-section,.pomodoro-task-selection,.pomodoro-timer-container,.pomodoro-tips-section{padding:1rem}}