.pomodoro-wrapper{max-width:700px}.mode-tabs{display:flex;justify-content:center;gap:.75rem;margin-bottom:2rem}.mode-btn{padding:.75rem 1.5rem;border:2px solid var(--bi-border);border-radius:50px;background:var(--bi-surface);color:var(--bi-text-muted);font-weight:500;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:.5rem}.mode-btn:hover{border-color:#3498db;color:#3498db;transform:translateY(-2px)}.mode-btn.active{background:linear-gradient(135deg,var(--brand) 0%,var(--brand-strong) 100%);border-color:transparent;color:#fff;box-shadow:0 4px 15px rgba(var(--brand-rgb),.4)}.mode-btn i{font-size:1.1rem}.timer-section{background:var(--bi-surface);border-radius:24px;padding:2.5rem;box-shadow:0 10px 40px #00000014;margin-bottom:1.5rem}.timer-container{position:relative;width:300px;height:300px;margin:0 auto 2rem}.progress-ring{width:100%;height:100%;transform:rotate(-90deg)}.progress-ring-bg{fill:none;stroke:#e8e8e8;stroke-width:8}.progress-ring-progress{fill:none;stroke:url(#gradient);stroke-width:8;stroke-linecap:round;stroke-dasharray:816.8;stroke-dashoffset:0;transition:stroke-dashoffset 1s linear}.timer-display{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.time-text{font-size:4rem;font-weight:700;color:var(--bi-text);font-variant-numeric:tabular-nums;line-height:1}.timer-status{font-size:1.1rem;color:#7f8c8d;margin-top:.5rem}.timer-controls{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.btn-control{padding:.875rem 1.75rem;border-radius:12px;font-weight:600;display:flex;align-items:center;gap:.5rem;transition:all .3s ease;border:none}.btn-start{background:linear-gradient(135deg,#11998e,#38ef7d);color:#fff;box-shadow:0 4px 15px #11998e66}.btn-start:hover{transform:translateY(-2px);box-shadow:0 6px 20px #11998e80;color:#fff}.btn-pause{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;box-shadow:0 4px 15px #f5576c66}.btn-pause:hover{transform:translateY(-2px);box-shadow:0 6px 20px #f5576c80;color:#fff}.btn-reset{background:var(--bi-surface-2);color:var(--bi-text-muted);border:2px solid var(--bi-border)}.btn-reset:hover{background:var(--bi-border);border-color:#ced4da}.btn-settings{background:var(--bi-surface);color:var(--bi-text-muted);border:2px solid var(--bi-border)}.btn-settings:hover{background:var(--bi-surface-2);border-color:#3498db;color:#3498db}.stats-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem}.stat-item{background:var(--bi-surface);border-radius:16px;padding:1.25rem;text-align:center;box-shadow:0 4px 15px #0000000d;transition:transform .3s ease}.stat-item:hover{transform:translateY(-3px)}.stat-item i{font-size:1.75rem;margin-bottom:.5rem;display:block}.stat-label{display:block;font-size:.85rem;color:#7f8c8d;margin-bottom:.25rem}.stat-value{font-size:1.75rem;font-weight:700;color:var(--bi-text)}.stat-unit{font-size:.85rem;color:#95a5a6}.task-section{background:var(--bi-surface);border-radius:20px;padding:1.5rem;box-shadow:0 4px 20px #0000000d}.task-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.task-header h3{font-size:1.25rem;font-weight:600;color:var(--bi-text);margin:0}.task-header h3 i{margin-right:.5rem;color:#3498db}.task-input-area{margin-bottom:1rem}.task-list{max-height:300px;overflow-y:auto}.task-item{display:flex;align-items:center;padding:1rem;background:var(--bi-surface-2);border-radius:12px;margin-bottom:.75rem;transition:all .3s ease}.task-item:hover{background:var(--bi-border)}.task-item.active{background:linear-gradient(135deg,rgba(var(--brand-rgb),.08),rgba(var(--brand-strong-rgb),.08));border:2px solid var(--brand)}.task-item.completed{opacity:.6}.task-item.completed .task-text{text-decoration:line-through;color:#95a5a6}.task-checkbox{width:22px;height:22px;border:2px solid #bdc3c7;border-radius:6px;margin-right:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.task-checkbox:hover{border-color:#3498db}.task-checkbox.checked{background:#27ae60;border-color:#27ae60}.task-checkbox.checked i{color:#fff;font-size:.875rem}.task-text{flex:1;font-size:1rem;color:var(--bi-text)}.task-pomodoros{display:flex;align-items:center;gap:.25rem;margin-right:1rem;color:#e74c3c;font-size:.875rem}.task-actions{display:flex;gap:.5rem}.task-btn{width:32px;height:32px;border-radius:8px;border:none;background:transparent;color:#95a5a6;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.task-btn:hover{background:var(--bi-surface)}.task-btn.select-btn:hover{color:#3498db}.task-btn.delete-btn:hover{color:#e74c3c}.task-btn.active{color:#3498db;background:var(--bi-surface)}.empty-tasks{text-align:center;padding:2rem;color:#95a5a6}.empty-tasks i{font-size:3rem;margin-bottom:1rem;opacity:.5}.modal-content{border-radius:20px;border:none}.modal-header{border-bottom:1px solid var(--bi-border);padding:1.5rem}.modal-title{font-weight:600;color:var(--bi-text)}.modal-title i{margin-right:.5rem;color:var(--bi-text-muted)}.modal-body{padding:1.5rem}.modal-footer{border-top:1px solid var(--bi-border);padding:1.25rem 1.5rem}.setting-item{margin-bottom:1.5rem}.setting-item:last-child{margin-bottom:0}.setting-label{display:flex;align-items:center;gap:.5rem;font-weight:500;color:var(--bi-text);margin-bottom:.75rem}.setting-control{display:flex;align-items:center;gap:1rem}.form-range{flex:1}.setting-value{min-width:80px;text-align:right;font-weight:600;color:#3498db}.complete-modal-content{border-radius:24px;padding:1rem}.complete-icon{font-size:5rem;color:#f1c40f;margin-bottom:1rem;animation:bounce 1s ease infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.complete-title{font-size:1.75rem;font-weight:700;color:var(--bi-text);margin-bottom:.5rem}.complete-message{color:#7f8c8d;margin-bottom:1.5rem}.complete-stats{background:linear-gradient(135deg,rgba(var(--brand-rgb),.08),rgba(var(--brand-strong-rgb),.08));border-radius:16px;padding:1.5rem;margin-bottom:1rem}.complete-stat-value{display:block;font-size:2.5rem;font-weight:700;color:var(--brand)}.complete-stat-label{color:#7f8c8d;font-size:.9rem}@media (max-width: 768px){.timer-section{padding:1.5rem}.timer-container{width:220px;height:220px}.time-text{font-size:2.5rem}.stats-panel{grid-template-columns:1fr}.mode-tabs{flex-wrap:wrap}.mode-btn{padding:.625rem 1.25rem;font-size:.9rem}.timer-controls{gap:.75rem}.btn-control{padding:.75rem 1.25rem;font-size:.9rem;min-height:44px}.task-input{min-height:40px}}@media (max-width: 575px){.timer-container{width:180px;height:180px}.time-text{font-size:2rem}.timer-section{padding:1rem}.mode-btn{padding:.5rem 1rem;font-size:.85rem}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.timer-running .timer-container{animation:pulse 2s ease infinite}.task-list::-webkit-scrollbar{width:6px}.task-list::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}.task-list::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.task-list::-webkit-scrollbar-thumb:hover{background:#a8a8a8}html[data-theme=dark] .progress-ring-bg{stroke:#334155}html[data-theme=dark] .timer-status,html[data-theme=dark] .stat-label,html[data-theme=dark] .complete-message,html[data-theme=dark] .complete-stat-label,html[data-theme=dark] .stat-unit,html[data-theme=dark] .task-btn,html[data-theme=dark] .empty-tasks{color:var(--bi-text-muted)}html[data-theme=dark] .btn-reset,html[data-theme=dark] .task-checkbox{border-color:#475569}html[data-theme=dark] .task-list::-webkit-scrollbar-track{background:#182238}html[data-theme=dark] .task-list::-webkit-scrollbar-thumb{background:#3b4a61}html[data-theme=dark] .task-list::-webkit-scrollbar-thumb:hover{background:#4b5b75}
