.time-tracking{background:var(--card-background, #ffffff);border-radius:12px;padding:24px;margin:24px 0;box-shadow:0 2px 8px #0000001a;border:1px solid var(--border-color, #e0e0e0);display:flow-root}.time-tracking-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--border-color, #e0e0e0)}.time-tracking-header h3{margin:0;color:var(--text-primary, #333333);font-size:1.5rem;font-weight:600}.date-range-selector{display:flex;align-items:center;gap:8px}.date-range-selector label{font-size:.9rem;color:var(--text-secondary, #666666);font-weight:500}.date-range-select{padding:6px 12px;border:1px solid var(--border-color, #e0e0e0);border-radius:6px;background:var(--input-background, #ffffff);color:var(--text-primary, #333333);font-size:.9rem;cursor:pointer;transition:border-color .2s ease}.date-range-select:hover{border-color:var(--primary-color, #007bff)}.date-range-select:focus{outline:none;border-color:var(--primary-color, #007bff);box-shadow:0 0 0 2px #007bff40}.time-tracking-content,.time-summary{display:flex;flex-direction:column;gap:20px}.time-total{text-align:center;padding:32px 20px;background:linear-gradient(135deg,var(--primary-color, #007bff) 0%,#0056b3 100%);border-radius:12px;color:#fff;display:flex;flex-direction:column;align-items:center;gap:8px}.time-value{font-size:3rem;font-weight:700;line-height:1;text-shadow:0 2px 4px rgba(0,0,0,.2)}.time-label{font-size:1.1rem;font-weight:500;opacity:.9;text-transform:uppercase;letter-spacing:.5px}.time-details{display:grid;grid-template-columns:1fr 1fr;gap:16px}.time-period,.time-range{background:var(--card-secondary, #f8f9fa);padding:16px;border-radius:8px;border:1px solid var(--border-light, #f0f0f0)}.period-label,.range-label{display:block;font-size:.85rem;color:var(--text-secondary, #666666);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.period-value,.range-value{display:block;font-size:1rem;color:var(--text-primary, #333333);font-weight:500}.time-range.remaining-negative .range-value{color:#c0392b;font-weight:600}.bars-layout{display:grid;grid-template-columns:220px 1fr;gap:20px;align-items:stretch}.remaining-panel{background:var(--card-secondary, #f8f9fa);border:1px solid var(--border-light, #f0f0f0);border-radius:8px;padding:16px;text-align:center;display:flex;flex-direction:column;justify-content:center}.remaining-panel .remaining-label{font-size:.9rem;color:var(--text-secondary, #666666);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;font-weight:600}.bars-header .remaining-label{font-size:.9rem;color:var(--text-secondary, #666666);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.remaining-panel .remaining-value{font-size:2rem;font-weight:700;color:var(--text-primary, #333333)}.remaining-panel.remaining-negative .remaining-value{color:#c0392b}.remaining-panel .remaining-percent{margin-top:6px;font-size:.95rem;color:var(--text-secondary, #666666)}.bars-panel{background:var(--card-secondary, #f8f9fa);border:1px solid var(--border-light, #f0f0f0);border-radius:8px;padding:16px;display:flex;flex-direction:column}.bars-header{display:flex;gap:8px;align-items:baseline;margin-bottom:12px}.bar-row{display:grid;grid-template-columns:160px 1fr;align-items:center;gap:12px;margin-bottom:16px}.bar-label{font-size:.95rem;color:var(--text-primary, #333333);font-weight:600}.bar-container{position:relative;height:22px;background:#eceff1;border-radius:999px;overflow:hidden;border:1px solid #e0e0e0}.bar-container.stacked{height:28px}.bar{height:100%;border-radius:999px}.bar--purchased{background:linear-gradient(90deg,#2ecc71,#27ae60)}.bar--used{background:linear-gradient(90deg,#007bff,#0056b3)}.bar--over{position:absolute;top:0;height:100%;background:linear-gradient(90deg,#e74c3c,#c0392b)}.bar-value{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#fff;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.2);font-size:.9rem}.bar-value--purchased{left:12px;right:auto}.bar-value--used{right:12px}.bar-legend{display:flex;gap:16px;margin-top:8px;align-items:center;flex-wrap:wrap}.legend-item{display:inline-flex;align-items:center;gap:6px;font-size:.9rem;color:var(--text-secondary, #666666)}.legend-swatch{display:inline-block;width:14px;height:14px;border-radius:3px}.swatch--purchased{background:linear-gradient(90deg,#2ecc71,#27ae60)}.swatch--used{background:linear-gradient(90deg,#007bff,#0056b3)}.swatch--over{background:linear-gradient(90deg,#e74c3c,#c0392b)}.capacity-row{position:relative;display:flex;align-items:center;gap:8px;margin-bottom:10px}.capacity-outline{position:relative;height:28px;min-width:120px;background:#fff;border-radius:999px;border:2px solid #4a4a4a;box-sizing:border-box;overflow:hidden}.capacity-outline.has-overrun,.capacity-outline.has-overrun .capacity-fill{border-top-right-radius:0;border-bottom-right-radius:0}.capacity-fill{height:100%;background:linear-gradient(90deg,#2ecc71,#27ae60);border-top-right-radius:999px;border-bottom-right-radius:999px}.capacity-overrun{position:absolute;height:28px;background:linear-gradient(90deg,#e74c3c,#c0392b);border-radius:0 999px 999px 0;border:2px solid #4a4a4a;box-sizing:border-box}.labels-box{background:#fff;border:1px solid var(--border-color, #e0e0e0);border-radius:6px;padding:10px 12px;display:flex;flex-direction:column;gap:8px}.labels-row{display:flex;justify-content:space-between;align-items:baseline}.label-text{font-size:.9rem;color:var(--text-secondary, #666666);font-weight:700;text-transform:uppercase;letter-spacing:.5px}.label-value{font-size:1rem;color:var(--text-primary, #333333);font-weight:700;min-width:90px;text-align:right}.meta-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}.meta-item{background:#fff;border:1px solid var(--border-color, #e0e0e0);border-radius:6px;padding:10px 12px}.meta-label{display:block;font-size:.8rem;text-transform:uppercase;color:var(--text-secondary, #666666);letter-spacing:.5px;font-weight:700}.meta-value{display:block;font-size:.95rem;color:var(--text-primary, #333333);margin-top:2px}@media (max-width: 768px){.bars-layout,.bar-row{grid-template-columns:1fr}}.no-time-message{text-align:center;padding:32px 20px;background:var(--warning-background, #fff3cd);border:1px solid var(--warning-border, #ffeaa7);border-radius:8px;color:var(--warning-text, #856404)}.no-time-message p{margin:0;font-size:1rem;font-weight:500}.time-tracking-loading{text-align:center;padding:40px 20px;color:var(--text-secondary, #666666)}.loading-spinner{width:40px;height:40px;border:4px solid var(--border-light, #f0f0f0);border-top:4px solid var(--primary-color, #007bff);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.time-tracking-loading p{margin:0;font-size:1rem}.time-tracking-error{text-align:center;padding:32px 20px;background:var(--error-background, #f8d7da);border:1px solid var(--error-border, #f5c6cb);border-radius:8px;color:var(--error-text, #721c24)}.time-tracking-error p{margin:0 0 16px;font-size:1rem}.retry-button{background:var(--primary-color, #007bff);color:#fff;border:none;padding:10px 20px;border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease}.retry-button:hover{background:#0056b3;transform:translateY(-1px)}.retry-button:active{transform:translateY(0)}@media (max-width: 768px){.time-tracking{padding:16px;margin:16px 0}.time-tracking-header{flex-direction:column;align-items:flex-start;gap:16px}.date-range-selector{align-self:stretch;justify-content:space-between}.time-value{font-size:2.5rem}.time-details{grid-template-columns:1fr;gap:12px}.time-period,.time-range{padding:12px}}@media (max-width: 480px){.time-tracking{padding:12px}.time-value{font-size:2rem}.time-label{font-size:1rem}.time-total{padding:24px 16px}}:root{--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-primary-light: #dbeafe;--color-secondary: #6b7280;--color-secondary-light: #9ca3af;--color-success: #059669;--color-error: #dc2626;--color-warning: #f59e0b;--color-red: #ef4444;--color-red-hover: #dc2626;--color-text-primary: #1a1a1a;--color-text-secondary: #6b7280;--color-text-tertiary: #9ca3af;--color-text-muted: #9ca3af;--color-bg-primary: #fafafa;--color-bg-secondary: white;--color-bg-tertiary: #f8fafc;--color-bg-overlay: rgba(0, 0, 0, .3);--color-border-primary: #e1e5e9;--color-border-secondary: #d1d5db;--color-border-focus: #3b82f6;--color-status-active: #dcfce7;--color-status-active-text: #166534;--color-status-inactive: #fef2f2;--color-status-inactive-text: #dc2626;--color-input-border: #d1d5db;--color-input-focus: #3b82f6;--color-input-focus-shadow: rgba(59, 130, 246, .1);--shadow-color: rgba(0, 0, 0, .1);--shadow-color-medium: rgba(0, 0, 0, .15);--shadow-color-heavy: rgba(0, 0, 0, .2)}:root{--font-family-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-size-xs: 11px;--font-size-sm: 12px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 24px;--font-size-2xl: 28px;--font-size-3xl: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--line-height-tight: 1.4;--line-height-normal: 1.5;--line-height-relaxed: 1.6}:root{--spacing-1: 4px;--spacing-2: 8px;--spacing-3: 12px;--spacing-4: 16px;--spacing-5: 20px;--spacing-6: 24px;--spacing-8: 32px;--spacing-10: 40px;--spacing-15: 60px}:root{--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-full: 50%}:root{--shadow-sm: 0 1px 2px var(--shadow-color);--shadow-md: 0 1px 3px var(--shadow-color);--shadow-lg: 0 4px 12px var(--shadow-color);--shadow-xl: 0 8px 25px var(--shadow-color-heavy);--shadow-drawer: -4px 0 12px var(--shadow-color-medium)}:root{--transition-fast: .2s ease;--transition-normal: .3s ease}:root{--container-max-width: 1200px;--sidebar-width: 300px;--column-min-width: 280px;--drawer-width: 400px}:root{--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070}body{font-family:var(--font-family-primary);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text-primary)}.text-xs{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.text-sm{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.text-base{font-size:var(--font-size-base);font-weight:var(--font-weight-medium)}.text-md{font-size:var(--font-size-md);font-weight:var(--font-weight-semibold)}.text-lg{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}.text-xl{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold)}.text-2xl{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold)}.text-3xl{font-size:var(--font-size-3xl);font-weight:var(--font-weight-semibold)}.font-normal{font-weight:var(--font-weight-normal)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.text-primary{color:var(--color-text-primary)}.text-secondary{color:var(--color-text-secondary)}.text-tertiary{color:var(--color-text-tertiary)}.text-muted{color:var(--color-text-muted)}.text-success{color:var(--color-success)}.text-error{color:var(--color-error)}.leading-tight{line-height:var(--line-height-tight)}.leading-normal{line-height:var(--line-height-normal)}.leading-relaxed{line-height:var(--line-height-relaxed)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.tracking-wide{letter-spacing:.5px}.no-margin{margin:0}.title-large{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.title-medium{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.title-small{font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.subtitle{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0}.caption{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.micro{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);margin:0}.container{max-width:var(--container-max-width);margin:0 auto;padding:var(--spacing-6) var(--spacing-4)}.m-0{margin:0}.m-1{margin:var(--spacing-1)}.m-2{margin:var(--spacing-2)}.m-3{margin:var(--spacing-3)}.m-4{margin:var(--spacing-4)}.m-5{margin:var(--spacing-5)}.m-6{margin:var(--spacing-6)}.m-8{margin:var(--spacing-8)}.m-10{margin:var(--spacing-10)}.m-15{margin:var(--spacing-15)}.mt-0{margin-top:0}.mt-1{margin-top:var(--spacing-1)}.mt-2{margin-top:var(--spacing-2)}.mt-3{margin-top:var(--spacing-3)}.mt-4{margin-top:var(--spacing-4)}.mt-5{margin-top:var(--spacing-5)}.mt-6{margin-top:var(--spacing-6)}.mt-8{margin-top:var(--spacing-8)}.mt-10{margin-top:var(--spacing-10)}.mt-15{margin-top:var(--spacing-15)}.mb-0{margin-bottom:0}.mb-1{margin-bottom:var(--spacing-1)}.mb-2{margin-bottom:var(--spacing-2)}.mb-3{margin-bottom:var(--spacing-3)}.mb-4{margin-bottom:var(--spacing-4)}.mb-5{margin-bottom:var(--spacing-5)}.mb-6{margin-bottom:var(--spacing-6)}.mb-8{margin-bottom:var(--spacing-8)}.mb-10{margin-bottom:var(--spacing-10)}.mb-15{margin-bottom:var(--spacing-15)}.ml-0{margin-left:0}.ml-1{margin-left:var(--spacing-1)}.ml-2{margin-left:var(--spacing-2)}.ml-3{margin-left:var(--spacing-3)}.ml-4{margin-left:var(--spacing-4)}.ml-5{margin-left:var(--spacing-5)}.ml-6{margin-left:var(--spacing-6)}.ml-8{margin-left:var(--spacing-8)}.ml-10{margin-left:var(--spacing-10)}.ml-15{margin-left:var(--spacing-15)}.mr-0{margin-right:0}.mr-1{margin-right:var(--spacing-1)}.mr-2{margin-right:var(--spacing-2)}.mr-3{margin-right:var(--spacing-3)}.mr-4{margin-right:var(--spacing-4)}.mr-5{margin-right:var(--spacing-5)}.mr-6{margin-right:var(--spacing-6)}.mr-8{margin-right:var(--spacing-8)}.mr-10{margin-right:var(--spacing-10)}.mr-15{margin-right:var(--spacing-15)}.p-0{padding:0}.p-1{padding:var(--spacing-1)}.p-2{padding:var(--spacing-2)}.p-3{padding:var(--spacing-3)}.p-4{padding:var(--spacing-4)}.p-5{padding:var(--spacing-5)}.p-6{padding:var(--spacing-6)}.p-8{padding:var(--spacing-8)}.p-10{padding:var(--spacing-10)}.p-15{padding:var(--spacing-15)}.pt-0{padding-top:0}.pt-1{padding-top:var(--spacing-1)}.pt-2{padding-top:var(--spacing-2)}.pt-3{padding-top:var(--spacing-3)}.pt-4{padding-top:var(--spacing-4)}.pt-5{padding-top:var(--spacing-5)}.pt-6{padding-top:var(--spacing-6)}.pt-8{padding-top:var(--spacing-8)}.pt-10{padding-top:var(--spacing-10)}.pt-15{padding-top:var(--spacing-15)}.pb-0{padding-bottom:0}.pb-1{padding-bottom:var(--spacing-1)}.pb-2{padding-bottom:var(--spacing-2)}.pb-3{padding-bottom:var(--spacing-3)}.pb-4{padding-bottom:var(--spacing-4)}.pb-5{padding-bottom:var(--spacing-5)}.pb-6{padding-bottom:var(--spacing-6)}.pb-8{padding-bottom:var(--spacing-8)}.pb-10{padding-bottom:var(--spacing-10)}.pb-15{padding-bottom:var(--spacing-15)}.pl-0{padding-left:0}.pl-1{padding-left:var(--spacing-1)}.pl-2{padding-left:var(--spacing-2)}.pl-3{padding-left:var(--spacing-3)}.pl-4{padding-left:var(--spacing-4)}.pl-5{padding-left:var(--spacing-5)}.pl-6{padding-left:var(--spacing-6)}.pl-8{padding-left:var(--spacing-8)}.pl-10{padding-left:var(--spacing-10)}.pl-15{padding-left:var(--spacing-15)}.pr-0{padding-right:0}.pr-1{padding-right:var(--spacing-1)}.pr-2{padding-right:var(--spacing-2)}.pr-3{padding-right:var(--spacing-3)}.pr-4{padding-right:var(--spacing-4)}.pr-5{padding-right:var(--spacing-5)}.pr-6{padding-right:var(--spacing-6)}.pr-8{padding-right:var(--spacing-8)}.pr-10{padding-right:var(--spacing-10)}.pr-15{padding-right:var(--spacing-15)}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.flex-1{flex:1}.flex-auto{flex:auto}.flex-none{flex:none}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.items-baseline{align-items:baseline}.items-stretch{align-items:stretch}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.gap-1{gap:var(--spacing-1)}.gap-2{gap:var(--spacing-2)}.gap-3{gap:var(--spacing-3)}.gap-4{gap:var(--spacing-4)}.gap-5{gap:var(--spacing-5)}.gap-6{gap:var(--spacing-6)}.gap-8{gap:var(--spacing-8)}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.w-full{width:100%}.w-auto{width:auto}.h-full{height:100%}.h-screen{height:100vh}.min-h-screen{min-height:100vh}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-scroll{overflow:scroll}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.bg-primary{background-color:var(--color-bg-primary)}.bg-secondary{background-color:var(--color-bg-secondary)}.bg-tertiary{background-color:var(--color-bg-tertiary)}.border{border:1px solid var(--color-border-primary)}.border-0{border:0}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-full{border-radius:var(--radius-full)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-xl{box-shadow:var(--shadow-xl)}.cursor-pointer{cursor:pointer}.cursor-grab{cursor:grab}.cursor-not-allowed{cursor:not-allowed}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-dropdown{z-index:var(--z-dropdown)}.z-sticky{z-index:var(--z-sticky)}.z-fixed{z-index:var(--z-fixed)}.z-modal-backdrop{z-index:var(--z-modal-backdrop)}.z-modal{z-index:var(--z-modal)}.transition,.transition-fast{transition:all var(--transition-fast)}.transition-normal{transition:all var(--transition-normal)}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.opacity-100{opacity:1}.visible{visibility:visible}.invisible{visibility:hidden}.view-container{max-width:var(--container-max-width);margin:0 auto;font-family:var(--font-family-primary);background-color:var(--color-bg-primary);min-height:100vh;padding:var(--spacing-6) var(--spacing-4)}.view-header{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-6);margin-bottom:var(--spacing-6);box-shadow:var(--shadow-md);border:1px solid var(--color-border-primary)}.view-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-2) 0}.view-subtitle{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0}.board-container{display:flex;gap:var(--spacing-4);overflow-x:auto;padding-bottom:var(--spacing-4)}.column{min-width:var(--column-min-width);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:1px solid var(--color-border-primary);display:flex;flex-direction:column}.column-header{padding:var(--spacing-4) var(--spacing-5);border-bottom:1px solid var(--color-border-primary);background-color:var(--color-bg-tertiary)}.column-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-1) 0;text-transform:uppercase;letter-spacing:.5px}.column-count{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.column-content{padding:var(--spacing-3);flex:1;min-height:200px}.column-content--dragging-over{background-color:#f0f9ff}.view-loading{text-align:center;padding:var(--spacing-10);color:var(--color-text-secondary)}.view-error{background-color:#fef2f2;border:1px solid #fecaca;border-radius:var(--radius-md);padding:var(--spacing-4);color:var(--color-error);margin-bottom:var(--spacing-4)}.column-empty{text-align:center;padding:var(--spacing-10) var(--spacing-5);color:var(--color-text-secondary);font-size:var(--font-size-base)}.completed-tasks-section{margin-top:2rem;padding:1.5rem;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef}.completed-tasks-header{margin-bottom:1rem}.completed-tasks-title{font-size:1.25rem;font-weight:600;color:#495057;margin:0 0 .5rem}.completed-tasks-loading{color:#6c757d;font-size:.875rem}.completed-tasks-list{display:flex;flex-direction:column;gap:.75rem}.completed-task-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem;background:#fff;border-radius:6px;border:1px solid #dee2e6;transition:box-shadow .2s ease}.completed-task-info{display:flex;align-items:center;gap:.5rem}.completed-task-item:hover{box-shadow:0 2px 4px #0000001a}.completed-task-name{font-weight:500;color:#495057;text-decoration:line-through;opacity:.8}.completed-task-date{font-size:.875rem;color:#6c757d;font-weight:500}.completed-tasks-empty{text-align:center;color:#6c757d;font-style:italic;padding:1rem}.admin-container{max-width:var(--container-max-width);margin:0 auto;font-family:var(--font-family-primary);background-color:var(--color-bg-primary);min-height:100vh;padding:var(--spacing-6) var(--spacing-4)}.admin-header{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-6);margin-bottom:var(--spacing-6);box-shadow:var(--shadow-md);border:1px solid var(--color-border-primary);display:flex;justify-content:space-between;align-items:center}.admin-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.admin-logout{background:var(--color-red);color:var(--color-bg-secondary);border:none;padding:var(--spacing-2) var(--spacing-4);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color var(--transition-fast)}.admin-logout:hover{background-color:var(--color-red-hover)}.admin-content{display:grid;grid-template-columns:1fr var(--sidebar-width);gap:var(--spacing-6);align-items:start}.admin-main{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-6);box-shadow:var(--shadow-md);border:1px solid var(--color-border-primary)}.admin-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-5)}.admin-section-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.admin-add-button{background:var(--color-primary);color:var(--color-bg-secondary);border:none;padding:var(--spacing-3) var(--spacing-5);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color var(--transition-fast);display:flex;align-items:center;gap:var(--spacing-2)}.admin-add-button:hover{background-color:var(--color-primary-hover)}.client-grid{display:grid;gap:var(--spacing-4);margin-top:var(--spacing-5)}.admin-sidebar{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-6);box-shadow:var(--shadow-md);border:1px solid var(--color-border-primary);position:sticky;top:var(--spacing-6)}.login-container{max-width:400px;margin:2rem auto;background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-8);box-shadow:var(--shadow-lg);border:1px solid var(--color-border-primary)}.login-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-6) 0;text-align:center}.login-form{display:flex;flex-direction:column;gap:var(--spacing-4)}.login-input{padding:var(--spacing-3) var(--spacing-4);border:1px solid var(--color-input-border);border-radius:var(--radius-md);font-size:var(--font-size-md);transition:border-color var(--transition-fast)}.login-input:focus{border-color:var(--color-input-focus);outline:none;box-shadow:0 0 0 3px var(--color-input-focus-shadow)}.login-button{background:var(--color-primary);color:var(--color-bg-secondary);border:none;padding:var(--spacing-3) var(--spacing-4);border-radius:var(--radius-md);font-size:var(--font-size-md);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color var(--transition-fast)}.login-button:hover{background-color:var(--color-primary-hover)}.login-button:disabled{opacity:.6;cursor:not-allowed}.admin-loading{text-align:center;padding:var(--spacing-10);color:var(--color-text-secondary);font-size:var(--font-size-base)}.admin-error{background-color:#fef2f2;border:1px solid #fecaca;border-radius:var(--radius-md);padding:var(--spacing-4);color:var(--color-error);margin-bottom:var(--spacing-4);font-size:var(--font-size-base)}.admin-empty{text-align:center;padding:var(--spacing-15) var(--spacing-5);color:var(--color-text-secondary)}.admin-empty__icon{font-size:var(--font-size-3xl);margin-bottom:var(--spacing-4);opacity:.5}.admin-empty__text{font-size:var(--font-size-md);margin-bottom:var(--spacing-2)}.admin-empty__subtext{font-size:var(--font-size-base);color:var(--color-text-tertiary)}.task-card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border-primary);border-radius:var(--radius-md);padding:var(--spacing-3);margin-bottom:var(--spacing-2);cursor:grab;transition:all var(--transition-fast);box-shadow:var(--shadow-sm)}.task-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px);border-color:var(--color-primary)}.task-card--dragging{box-shadow:var(--shadow-xl)}.task-card--updating{opacity:.6;pointer-events:none}.task-title{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-primary);margin:0 0 var(--spacing-2) 0;line-height:var(--line-height-tight)}.comment-indicator{display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background-color:#f3f4f6;border-radius:var(--radius-xl);font-size:var(--font-size-xs);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);border:none;align-self:flex-start}.comment-indicator:hover{background-color:#e5e7eb;color:var(--color-text-primary)}.comment-icon{font-size:var(--font-size-sm)}.task-status{margin-top:var(--spacing-2)}.task-status__success{color:var(--color-success);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.task-status__error{color:var(--color-error);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.task-status__updating{color:var(--color-primary);font-size:var(--font-size-xs)}.status-indicator{display:inline-block;width:8px;height:8px;border-radius:var(--radius-full);margin-right:var(--spacing-1)}.drawer-overlay{position:fixed;inset:0;background-color:var(--color-bg-overlay);z-index:var(--z-modal-backdrop);opacity:0;visibility:hidden;transition:opacity var(--transition-normal),visibility var(--transition-normal)}.drawer-overlay--visible{opacity:1;visibility:visible}.drawer{position:fixed;top:0;right:0;width:var(--drawer-width);height:100vh;background-color:var(--color-bg-secondary);box-shadow:var(--shadow-drawer);transform:translate(100%);transition:transform var(--transition-normal);z-index:var(--z-modal);display:flex;flex-direction:column}.drawer--open{transform:translate(0)}.drawer-header{padding:var(--spacing-5) var(--spacing-6);border-bottom:1px solid var(--color-border-primary);display:flex;justify-content:space-between;align-items:center}.drawer-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.drawer-close{background:none;border:none;font-size:var(--font-size-xl);cursor:pointer;color:var(--color-text-secondary);padding:var(--spacing-1);border-radius:var(--radius-sm);transition:background-color var(--transition-fast)}.drawer-close:hover{background-color:#f3f4f6}.drawer-content{flex:1;padding:var(--spacing-6);overflow-y:auto}.drawer-task-title{margin:0 0 var(--spacing-4) 0;font-size:var(--font-size-md);color:var(--color-text-primary)}.comment-group{margin-bottom:var(--spacing-5)}.comment-date{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-2);text-transform:uppercase;letter-spacing:.5px}.comment-list{list-style:none;padding:0;margin:0}.comment-item{background-color:var(--color-bg-tertiary);border:1px solid var(--color-border-primary);border-radius:var(--radius-md);padding:var(--spacing-3);margin-bottom:var(--spacing-2);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text-primary)}.client-card{background:var(--color-bg-secondary);border:1px solid var(--color-border-primary);border-radius:var(--radius-lg);padding:var(--spacing-5);transition:all var(--transition-fast);cursor:pointer}.client-card:hover{box-shadow:var(--shadow-lg);border-color:var(--color-primary)}.client-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-3)}.client-name{font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-1) 0}.client-slug{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.client-details{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-bottom:var(--spacing-4)}.client-actions{display:flex;gap:var(--spacing-2)}.client-action-button{padding:var(--spacing-1) var(--spacing-3);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;border:1px solid;transition:all var(--transition-fast)}.client-action-button--edit{background:var(--color-bg-secondary);color:var(--color-primary);border-color:var(--color-primary)}.client-action-button--edit:hover{background:var(--color-primary);color:var(--color-bg-secondary)}.client-action-button--delete{background:var(--color-bg-secondary);color:var(--color-error);border-color:var(--color-error)}.client-action-button--delete:hover{background:var(--color-error);color:var(--color-bg-secondary)}.admin-form{display:flex;flex-direction:column;gap:var(--spacing-4)}.form-group{display:flex;flex-direction:column;gap:var(--spacing-1)}.form-label{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.form-input{padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-input-border);border-radius:var(--radius-md);font-size:var(--font-size-base);transition:border-color var(--transition-fast)}.form-input:focus{border-color:var(--color-input-focus);outline:none;box-shadow:0 0 0 3px var(--color-input-focus-shadow)}.form-input:disabled{background-color:#f9fafb;color:var(--color-text-secondary);cursor:not-allowed}.form-actions{display:flex;gap:var(--spacing-3);margin-top:var(--spacing-2)}.form-submit{background:var(--color-primary);color:var(--color-bg-secondary);border:none;padding:var(--spacing-2) var(--spacing-5);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color var(--transition-fast)}.form-submit:hover{background-color:var(--color-primary-hover)}.form-submit:disabled{opacity:.6;cursor:not-allowed}.form-cancel{background:var(--color-bg-secondary);color:var(--color-text-secondary);border:1px solid var(--color-input-border);padding:var(--spacing-2) var(--spacing-5);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.form-cancel:hover{background-color:#f9fafb;border-color:var(--color-text-tertiary)}.status-badge{display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);border-radius:var(--radius-xl);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.status-badge--active{background:var(--color-status-active);color:var(--color-status-active-text)}.status-badge--inactive{background:var(--color-status-inactive);color:var(--color-status-inactive-text)}
