.dashboard-container{padding:24px;background:var(--bg-primary);min-height:100vh}.category-section{margin-bottom:32px}.category-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:0 12px}.category-header h2{font-size:1.25rem;font-weight:500;color:var(--text-primary);margin:0}.category-header .widget-button{padding:8px 16px;font-size:.875rem;background:var(--accent-primary);color:#fff;border-radius:6px;height:auto;width:auto;transition:all .2s ease;display:flex;align-items:center;gap:8px}.category-header .widget-button:hover{background:var(--accent-primary);opacity:.9;transform:translateY(-1px);box-shadow:var(--shadow-sm)}.widgets-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:24px;padding:0 12px}.widget{background:#fff;border-radius:12px;box-shadow:0 1px 3px #0000001a;overflow:hidden;position:relative;min-height:350px;display:flex;flex-direction:column;margin-bottom:20px}.widget-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--border-color)}.widget-header h3{margin:0;font-size:1rem;font-weight:500;color:var(--text-primary)}.widget-buttons{display:flex;gap:16px;align-items:center;position:relative}.widget-actions{display:flex;gap:8px;align-items:center;padding-right:8px;border-right:1px solid var(--border-color)}.widget-button{background:none;border:none;cursor:pointer;padding:6px;border-radius:6px;color:var(--text-secondary);transition:all .2s ease;display:flex;align-items:center;justify-content:center;height:32px;width:32px}.widget-button:hover{background:var(--bg-primary);color:var(--text-primary);transform:translateY(-1px)}.widget-button svg{width:18px;height:18px;transition:transform .2s ease}.widget-button:hover svg{transform:scale(1.1)}.widget-content{flex:1;padding:24px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;min-height:280px}.widget-chart{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;gap:16px;min-height:200px}.widget-chart canvas{max-width:100%;height:auto!important}.widget-legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;width:100%;margin-top:20px;padding:0 16px}.widget-legend.inline{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin-top:16px}.legend-item{display:flex;align-items:center;gap:8px;font-size:.875rem;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:4px 8px}.legend-item span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.legend-color{width:12px;height:12px;border-radius:3px}.widget-header{position:relative}.fullscreen-button{opacity:.7;transition:all .2s ease;background:var(--bg-secondary)!important;border:1px solid var(--border-color)!important;box-shadow:var(--shadow-sm);margin-left:8px!important}.widget.fullscreen .widget-header{padding:24px 32px}.widget.fullscreen .widget-buttons{display:flex;gap:16px}.widget.fullscreen .fullscreen-button{position:relative;background:var(--bg-secondary)!important;padding:8px!important;width:40px!important;height:40px!important;border-radius:8px!important;opacity:1;box-shadow:var(--shadow-md)!important;margin-left:16px!important}.widget.fullscreen .fullscreen-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)!important;background:var(--bg-primary)!important}.widget.fullscreen .widget-content{padding:32px;display:flex;flex-direction:column;align-items:center;justify-content:center}.widget.fullscreen .widget-chart{max-width:1200px;width:100%;margin:0 auto}.progress-container{width:100%;padding:16px;display:flex;flex-direction:column;gap:20px}.progress-bar-group{display:flex;flex-direction:column;gap:8px}.progress-bar-header{display:flex;justify-content:space-between;align-items:center;font-size:.875rem}.progress-bar{height:8px;background:var(--bg-primary);border-radius:4px;overflow:hidden;position:relative}.progress-bar-segment{height:100%;position:absolute;left:0;transition:width .3s ease}.progress-stats{display:flex;flex-wrap:wrap;gap:16px;margin-top:8px;font-size:.875rem;color:var(--text-secondary)}.progress-stat{display:flex;align-items:center;gap:8px}.fullscreen-button{position:relative;opacity:.7;transition:all .2s ease;font-size:1.2rem;color:var(--text-secondary);background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-sm)}.widget:hover .fullscreen-button{opacity:1;transform:translateY(-1px);box-shadow:var(--shadow-md)}.fullscreen-button:hover{background:var(--bg-primary)!important;color:var(--text-primary)!important}.widget.fullscreen .fullscreen-button{position:fixed;top:20px;right:20px;z-index:1001;background:var(--bg-secondary);border:1px solid var(--border-color);padding:12px;width:40px;height:40px;border-radius:8px;opacity:1;box-shadow:var(--shadow-md)}.widget.fullscreen .fullscreen-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.widget.fullscreen{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:1000;margin:0;border-radius:0;display:flex;flex-direction:column}.widget.fullscreen .widget-content{flex:1;padding:40px}.widget.fullscreen .widget-chart{max-width:1200px;margin:0 auto}.widget.fullscreen .widget-legend{margin-top:32px}.widget.fullscreen canvas{max-width:100%;max-height:70vh}.modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:999;display:flex;align-items:center;justify-content:center}.empty-widget{background:var(--bg-secondary);border:2px dashed var(--border-color);border-radius:12px;display:flex;align-items:center;justify-content:center;min-height:300px;transition:all .2s ease}.empty-widget:hover{border-color:var(--accent-primary);background:var(--bg-primary)}.empty-widget .widget-button{font-size:1rem;padding:12px 24px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);transition:all .2s ease;display:flex;align-items:center;gap:8px}.empty-widget .widget-button:hover{background:var(--accent-primary);border-color:var(--accent-primary);color:#fff;transform:translateY(-1px);box-shadow:var(--shadow-sm)}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;padding:0 12px}.dashboard-header h1{font-size:1.5rem;font-weight:500;color:var(--text-primary);margin:0}.header-controls{display:flex;gap:16px;align-items:center}.search-bar{display:flex;align-items:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;padding:6px 12px}.search-bar input{border:none;background:none;outline:none;font-size:.875rem;color:var(--text-primary);width:200px}.search-bar input::placeholder{color:var(--text-secondary)}:root{--bg-primary: #f8f9fa;--bg-secondary: #ffffff;--text-primary: #2c3e50;--text-secondary: #6c757d;--accent-primary: #4CAF50;--accent-secondary: #2196F3;--danger: #dc3545;--border-color: #e9ecef;--shadow-sm: 0 1px 3px rgba(0,0,0,.12);--chart-blue: #3B82F6;--chart-green: #10B981;--chart-yellow: #F59E0B;--chart-red: #EF4444;--chart-purple: #8B5CF6;--chart-orange: #F97316;--chart-secondary: #6B7280;--shadow-md: 0 4px 6px rgba(0,0,0,.1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;background-color:var(--bg-primary);color:var(--text-primary)}.app{padding:20px;max-width:1200px;margin:0 auto}.topbar{display:flex;flex-direction:column;gap:20px;margin-bottom:30px;padding:20px;background:var(--bg-secondary);border-radius:8px;box-shadow:0 4px 6px #0000004d}.controls{display:flex;gap:20px;align-items:center}.search{flex:1;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:16px}.add-category-form{display:flex;gap:10px;margin-bottom:20px}.category-input{flex:1;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:16px}.add-button{padding:10px 20px;background-color:#4caf50;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:16px}.add-button:hover{background-color:#45a049}.categories-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.category{background:var(--bg-secondary);border-radius:8px;padding:20px;box-shadow:0 4px 6px #0000004d;border:1px solid var(--border-color)}.category-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;color:var(--text-primary)}.widgets-container{display:flex;flex-direction:column;gap:15px}.categories-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;padding:20px}.category{background:var(--bg-secondary);border-radius:8px;box-shadow:var(--shadow-sm);overflow:hidden}.category-header{padding:15px 20px;border-bottom:1px solid var(--border-color)}.category-title{display:flex;justify-content:space-between;align-items:center}.category-title h2{font-size:1.2rem;color:var(--text-primary);margin:0}.widgets-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;padding:20px}.widget{background:var(--bg-secondary);border-radius:8px;box-shadow:var(--shadow-sm);overflow:hidden;position:relative}.widget-header{padding:15px;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.widget-content{padding:20px;min-height:200px;display:flex;align-items:center;justify-content:center}.widget-chart{width:100%;height:200px}.add-widget-btn{padding:6px 12px;background:var(--accent-primary);color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:.9rem}.add-widget-btn:hover{background:var(--accent-secondary)}.widget-remove{position:absolute;top:10px;right:10px;background:none;border:none;color:var(--danger);cursor:pointer;font-size:1.2rem;opacity:0;transition:opacity .2s}.widget:hover .widget-remove{opacity:1}.empty-category{grid-column:1 / -1;display:flex;justify-content:center;align-items:center;padding:40px;background:var(--bg-primary);border-radius:8px;border:2px dashed var(--border-color)}.add-widget-btn-large{padding:12px 24px;font-size:1.1rem;background:var(--accent-primary);color:#fff;border:none;border-radius:6px;cursor:pointer}.add-widget-btn-large:hover{background:var(--accent-secondary)}.move-options{margin:10px 0}.move-options select{width:100%;padding:8px;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:4px}.widget h3{color:var(--text-primary);font-size:1.1em}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{background:var(--bg-secondary);color:var(--text-primary);padding:30px;border-radius:8px;width:90%;max-width:500px;border:1px solid var(--border-color);box-shadow:0 8px 16px #00000080;animation:modalFadeIn .3s ease}@keyframes modalFadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.modal h2{margin-bottom:20px}.form-group{margin-bottom:15px}.form-group label{display:block;margin-bottom:5px}.form-group input,.form-group textarea,.form-group select{width:100%;padding:8px;border:1px solid var(--border-color);border-radius:4px;font-size:16px;background:var(--bg-primary);color:var(--text-primary)}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--accent-primary)}.form-group textarea{min-height:100px;resize:vertical}.form-group label{color:var(--text-secondary);margin-bottom:8px;display:block}.modal-buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.dashboard{padding:20px;background:var(--bg-primary);min-height:100vh}.dashboard-header{background:var(--bg-secondary);padding:15px 20px;border-bottom:1px solid var(--border-color);margin-bottom:20px;box-shadow:var(--shadow-sm)}.dashboard-title{display:flex;justify-content:space-between;align-items:center}.dashboard-title h1{font-size:1.5rem;color:var(--text-primary);margin:0}.header-controls{display:flex;align-items:center;gap:20px}.search-bar{padding:8px 12px;border:1px solid var(--border-color);border-radius:4px;width:300px;font-size:.9rem}.time-filter{padding:8px 12px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:4px;color:var(--text-primary);cursor:pointer;display:flex;align-items:center;gap:8px}.time-filter:hover{background:var(--bg-primary)}
