*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #3b82f6;--color-primary-dark: #2563eb;--color-success: #10b981;--color-error: #ef4444;--color-warning: #f59e0b;--color-bg: #ffffff;--color-bg-secondary: #f9fafb;--color-bg-tertiary: #f3f4f6;--color-border: #e5e7eb;--color-text-primary: #111827;--color-text-secondary: #6b7280;--color-text-tertiary: #9ca3af;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-mono: "SF Mono", "Monaco", "Inconsolata", "Fira Code", "Droid Sans Mono", "Source Code Pro", monospace}body{font-family:var(--font-sans);line-height:1.5;color:var(--color-text-primary);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background-color:var(--color-primary);color:#fff;padding:var(--spacing-xl) var(--spacing-lg);text-align:center;box-shadow:var(--shadow-md)}.app-header h1{font-size:2rem;font-weight:700;margin-bottom:var(--spacing-sm)}.app-subtitle{font-size:1rem;opacity:.9}.app-main{flex:1;max-width:1200px;width:100%;margin:0 auto;padding:var(--spacing-xl) var(--spacing-lg)}.app-footer{background-color:var(--color-bg-tertiary);padding:var(--spacing-lg);color:var(--color-text-secondary);font-size:.875rem;border-top:1px solid var(--color-border)}.footer-content{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto}section{margin-bottom:var(--spacing-2xl)}.file-upload-container{width:100%}.file-upload-dropzone{border:2px dashed var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-2xl);text-align:center;cursor:pointer;transition:all .2s ease;background-color:var(--color-bg-secondary)}.file-upload-dropzone:hover:not(.disabled){border-color:var(--color-primary);background-color:var(--color-bg)}.file-upload-dropzone.dragging{border-color:var(--color-primary);background-color:var(--color-bg);transform:scale(1.02)}.file-upload-dropzone.disabled{opacity:.5;cursor:not-allowed}.file-upload-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md)}.file-upload-icon{width:48px;height:48px;color:var(--color-text-tertiary)}.file-upload-text{font-size:1rem;color:var(--color-text-primary)}.file-upload-hint{font-size:.875rem;color:var(--color-text-secondary)}.file-upload-error{margin-top:var(--spacing-md);padding:var(--spacing-md);background-color:#fef2f2;border:1px solid #fecaca;border-radius:var(--radius-md);color:var(--color-error);font-size:.875rem}.error-display{background-color:#fef2f2;border:1px solid #fecaca;border-radius:var(--radius-lg);padding:var(--spacing-lg)}.error-content{display:flex;align-items:flex-start;gap:var(--spacing-md)}.error-icon{width:24px;height:24px;color:var(--color-error);flex-shrink:0}.error-message-container{flex:1}.error-title{font-size:1rem;font-weight:600;color:var(--color-error);margin-bottom:var(--spacing-xs)}.error-message{font-size:.875rem;color:#991b1b}.error-dismiss{background:none;border:none;cursor:pointer;padding:var(--spacing-xs);color:var(--color-error);flex-shrink:0}.error-dismiss svg{width:20px;height:20px}.loading-indicator{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-lg);padding:var(--spacing-2xl)}.loading-spinner{width:64px;height:64px}.spinner-icon{animation:spin 1s linear infinite}.spinner-circle-bg{opacity:.25}.spinner-circle-fg{color:var(--color-primary)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-message{font-size:1rem;color:var(--color-text-secondary);font-weight:500}.processing-stats{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg)}.stats-title{font-size:1.125rem;font-weight:600;margin-bottom:var(--spacing-md);color:var(--color-text-primary)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md)}.stat-item{display:flex;flex-direction:column;gap:var(--spacing-xs)}.stat-label{font-size:.875rem;color:var(--color-text-secondary);font-weight:500}.stat-value{font-size:1rem;color:var(--color-text-primary);font-weight:600}.chart-container{background-color:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm)}.chart-empty{padding:var(--spacing-2xl);text-align:center;color:var(--color-text-secondary);background-color:var(--color-bg-secondary);border:1px dashed var(--color-border);border-radius:var(--radius-lg)}.chart-tooltip{background-color:#fff;border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:var(--shadow-md)}.tooltip-label{font-weight:600;margin-bottom:var(--spacing-xs);max-width:250px;word-wrap:break-word;overflow-wrap:break-word}.tooltip-date,.tooltip-date-range{font-size:.875rem;color:var(--color-text-secondary);margin-bottom:var(--spacing-sm)}.tooltip-metrics{display:flex;flex-direction:column;gap:var(--spacing-xs)}.tooltip-metrics p{font-size:.875rem;font-weight:500}.empty-state{padding:var(--spacing-2xl)}.empty-state-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);text-align:center;padding:var(--spacing-2xl);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);border:1px dashed var(--color-border)}.empty-state-icon{width:64px;height:64px;color:var(--color-text-tertiary)}.empty-state-content h2{font-size:1.5rem;font-weight:600;color:var(--color-text-primary)}.empty-state-content p{font-size:1rem;color:var(--color-text-secondary)}.period-selector{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.period-label{font-size:1rem;font-weight:600;color:var(--color-text-primary);white-space:nowrap}.period-select-wrapper{display:flex;align-items:center;gap:var(--spacing-md);flex:1}.period-select{padding:var(--spacing-sm) var(--spacing-md);font-size:1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:#fff;color:var(--color-text-primary);cursor:pointer;transition:all .2s ease;min-width:150px}.period-select:hover:not(:disabled){border-color:var(--color-primary)}.period-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a}.period-select:disabled{opacity:.5;cursor:not-allowed}.period-description{font-size:.875rem;color:var(--color-text-secondary)}.view-toggle{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.view-toggle-label{font-size:1rem;font-weight:600;color:var(--color-text-primary);white-space:nowrap}.view-toggle-options{display:flex;gap:var(--spacing-sm);flex:1}.view-toggle-option{position:relative;display:flex;align-items:center;padding:var(--spacing-sm) var(--spacing-lg);border:2px solid var(--color-border);border-radius:var(--radius-md);background-color:#fff;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none}.view-toggle-option:hover{border-color:var(--color-primary);background-color:var(--color-bg-secondary)}.view-toggle-option.active{border-color:var(--color-primary);background-color:var(--color-primary);color:#fff}.view-toggle-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}.view-toggle-option-label{font-size:.9375rem;font-weight:500}.view-toggle-option:focus-within{outline:none;box-shadow:0 0 0 3px #3b82f633}.view-toggle-option input[type=radio]:disabled~.view-toggle-option-label{opacity:.5;cursor:not-allowed}.metric-toggle{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.metric-toggle-label{font-size:1rem;font-weight:600;color:var(--color-text-primary);white-space:nowrap}.metric-toggle-options{display:flex;gap:var(--spacing-sm);flex:1}.metric-toggle-option{position:relative;display:flex;align-items:center;padding:var(--spacing-sm) var(--spacing-lg);border:2px solid var(--color-border);border-radius:var(--radius-md);background-color:#fff;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none}.metric-toggle-option:hover{border-color:var(--color-primary);background-color:var(--color-bg-secondary)}.metric-toggle-option.active{border-color:var(--color-primary);background-color:var(--color-primary);color:#fff}.metric-toggle-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}.metric-toggle-option-label{font-size:.9375rem;font-weight:500}.metric-toggle-option:focus-within{outline:none;box-shadow:0 0 0 3px #3b82f633}.metric-toggle-option input[type=radio]:disabled~.metric-toggle-option-label{opacity:.5;cursor:not-allowed}@media(max-width:768px){.app-header h1{font-size:1.5rem}.app-subtitle{font-size:.875rem}.app-main{padding:var(--spacing-lg) var(--spacing-md)}.stats-grid{grid-template-columns:1fr}.chart-container{padding:var(--spacing-md)}.period-selector{flex-direction:column;align-items:flex-start}.period-select-wrapper{flex-direction:column;align-items:flex-start;width:100%}.period-select{width:100%}}.language-selector{display:flex;align-items:center;gap:var(--spacing-sm)}.language-label{font-size:.875rem;font-weight:500;color:var(--color-text-secondary)}.language-select{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-bg-secondary);color:var(--color-text-primary);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease}.language-select:hover{border-color:var(--color-primary);background-color:var(--color-bg-primary)}.language-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a}.language-select option{background-color:var(--color-bg-secondary);color:var(--color-text-primary)}.header-content{max-width:1200px;margin:0 auto}@media(max-width:768px){.footer-content{flex-direction:column;gap:var(--spacing-md);text-align:center}.footer-content p{order:2}.language-selector{order:1;align-self:flex-end}}