:root{--font-heading: "Outfit", "Inter", system-ui, -apple-system, sans-serif;--font-body: "Inter", system-ui, -apple-system, sans-serif;--primary-hue: 221;--primary-saturation: 83%;--primary: hsl(var(--primary-hue), var(--primary-saturation), 45%);--primary-light: hsl(var(--primary-hue), var(--primary-saturation), 96%);--primary-medium: hsl(var(--primary-hue), var(--primary-saturation), 85%);--primary-hover: hsl(var(--primary-hue), var(--primary-saturation), 38%);--secondary: hsl(215, 25%, 27%);--success: hsl(142, 72%, 29%);--success-bg: hsl(142, 70%, 95%);--success-border: hsl(142, 60%, 88%);--warning: hsl(38, 92%, 35%);--warning-bg: hsl(38, 90%, 95%);--warning-border: hsl(38, 80%, 88%);--danger: hsl(350, 89%, 40%);--danger-bg: hsl(350, 80%, 96%);--danger-border: hsl(350, 70%, 90%);--bg-app: hsl(210, 40%, 97.5%);--bg-card: hsl(0, 0%, 100%);--text-primary: hsl(220, 40%, 12%);--text-secondary: hsl(220, 16%, 42%);--text-muted: hsl(220, 12%, 60%);--border: hsl(214, 32%, 91%);--border-focus: hsl(var(--primary-hue), var(--primary-saturation), 70%);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .03), 0 1px 1px -1px rgba(0, 0, 0, .03);--shadow-md: 0 4px 6px -1px rgba(15, 23, 42, .04), 0 2px 4px -2px rgba(15, 23, 42, .04);--shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, .05), 0 4px 6px -4px rgba(15, 23, 42, .05);--shadow-glow: 0 0 20px rgba(30, 80, 220, .08);--sidebar-width: 280px;--header-height: 72px;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--radius-full: 9999px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-app);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:600;color:var(--text-primary)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#d5d7dd;border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:#b9bdc6}.app-container{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);height:100vh;background-color:var(--bg-card);border-right:1px solid var(--border);display:flex;flex-direction:column;position:sticky;top:0;z-index:100;padding:24px 16px;flex-shrink:0}.logo-container{display:flex;align-items:center;gap:12px;padding:8px 12px 28px;border-bottom:1px solid var(--border);margin-bottom:24px}.logo-icon{background:linear-gradient(135deg,var(--primary),hsl(var(--primary-hue),var(--primary-saturation),65%));color:#fff;width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #1e50dc33}.logo-text{font-family:var(--font-heading);font-size:1.25rem;font-weight:800;letter-spacing:-.5px;background:linear-gradient(135deg,var(--text-primary),var(--primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.nav-menu{display:flex;flex-direction:column;gap:6px;flex-grow:1}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 16px;color:var(--text-secondary);text-decoration:none;font-size:.95rem;font-weight:500;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent}.nav-item:hover{background-color:var(--primary-light);color:var(--primary)}.nav-item.active{background-color:var(--primary-light);color:var(--primary);font-weight:600;border:1px solid var(--primary-medium)}.sidebar-footer{padding-top:16px;border-top:1px solid var(--border);display:flex;align-items:center;gap:12px}.user-avatar{width:40px;height:40px;border-radius:var(--radius-full);background-color:var(--primary-medium);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:600;font-family:var(--font-heading);border:2px solid white;box-shadow:var(--shadow-sm)}.user-info{display:flex;flex-direction:column}.user-name{font-size:.875rem;font-weight:600;color:var(--text-primary)}.user-role{font-size:.75rem;color:var(--text-secondary)}.main-content{flex-grow:1;min-width:0;padding:40px 48px;display:flex;flex-direction:column;gap:32px;max-width:1600px}.page-header{display:flex;justify-content:space-between;align-items:center;gap:20px}.header-title-group h1{font-size:2rem;font-weight:700;letter-spacing:-.5px;color:var(--text-primary);margin-bottom:4px}.header-title-group p{color:var(--text-secondary);font-size:.975rem}.header-actions{display:flex;align-items:center;gap:16px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:var(--radius-md);font-size:.9rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent;outline:none;font-family:var(--font-body)}.btn-primary{background-color:var(--primary);color:#fff;box-shadow:0 4px 12px #1e50dc26}.btn-primary:hover{background-color:var(--primary-hover);box-shadow:0 6px 16px #1e50dc40;transform:translateY(-1px)}.btn-secondary{background-color:var(--bg-card);color:var(--text-secondary);border:1px solid var(--border);box-shadow:var(--shadow-sm)}.btn-secondary:hover{background-color:var(--primary-light);color:var(--primary);border-color:var(--primary-medium)}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}.kpi-card{background-color:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border);padding:24px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:16px;position:relative;overflow:hidden;transition:all var(--transition-normal)}.kpi-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg),var(--shadow-glow);border-color:var(--primary-medium)}.kpi-header{display:flex;justify-content:space-between;align-items:center}.kpi-title{font-size:.875rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.kpi-icon-wrapper{width:44px;height:44px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;background-color:var(--primary-light);color:var(--primary)}.kpi-icon-wrapper.success{background-color:var(--success-bg);color:var(--success)}.kpi-icon-wrapper.warning{background-color:var(--warning-bg);color:var(--warning)}.kpi-icon-wrapper.danger{background-color:var(--danger-bg);color:var(--danger)}.kpi-value-container{display:flex;align-items:baseline;gap:8px}.kpi-value{font-size:2.25rem;font-weight:700;font-family:var(--font-heading);letter-spacing:-.5px}.kpi-trend{display:inline-flex;align-items:center;gap:4px;font-size:.775rem;font-weight:600;padding:4px 8px;border-radius:var(--radius-full)}.kpi-trend.positive{background-color:var(--success-bg);color:var(--success)}.kpi-trend.negative{background-color:var(--danger-bg);color:var(--danger)}.kpi-footer{font-size:.8rem;color:var(--text-muted)}.dashboard-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:24px}@media (max-width: 1024px){.dashboard-grid{grid-template-columns:1fr}}.card{background-color:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border);padding:24px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:20px}.card-title-container{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border);padding-bottom:16px}.card-title{font-size:1.125rem;font-weight:700;letter-spacing:-.2px}.ranking-list{display:flex;flex-direction:column;gap:12px}.ranking-item{display:flex;align-items:center;justify-content:space-between;padding:12px;border-radius:var(--radius-md);border:1px solid var(--border);transition:all var(--transition-fast);background-color:var(--bg-app)}.ranking-item:hover{border-color:var(--primary-medium);background-color:var(--primary-light)}.ranking-profile{display:flex;align-items:center;gap:12px}.ranking-rank{font-size:.875rem;font-weight:700;width:24px;height:24px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;background-color:var(--border);color:var(--text-secondary)}.ranking-rank.top-1{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}.ranking-rank.top-2{background:linear-gradient(135deg,#94a3b8,#64748b);color:#fff}.ranking-rank.top-3{background:linear-gradient(135deg,#b45309,#78350f);color:#fff}.ranking-name{font-size:.9rem;font-weight:600}.ranking-stores{font-size:.75rem;color:var(--text-secondary)}.ranking-score-group{text-align:right}.ranking-score{font-size:.95rem;font-weight:700}.ranking-score.high{color:var(--success)}.ranking-score.medium{color:var(--warning)}.ranking-score.low{color:var(--danger)}.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius-md);border:1px solid var(--border)}.data-table{width:100%;border-collapse:collapse;text-align:left;font-size:.9rem}.data-table th{background-color:var(--primary-light);color:var(--text-primary);font-weight:600;padding:14px 18px;border-bottom:1px solid var(--border);white-space:nowrap}.data-table td{padding:14px 18px;border-bottom:1px solid var(--border);color:var(--text-secondary)}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background-color:var(--primary-light);color:var(--text-primary)}.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--radius-full);font-size:.75rem;font-weight:600}.badge-success{background-color:var(--success-bg);color:var(--success);border:1px solid var(--success-border)}.badge-warning{background-color:var(--warning-bg);color:var(--warning);border:1px solid var(--warning-border)}.badge-danger{background-color:var(--danger-bg);color:var(--danger);border:1px solid var(--danger-border)}.badge-info{background-color:var(--primary-light);color:var(--primary);border:1px solid var(--primary-medium)}.settings-section{display:flex;flex-direction:column;gap:24px}.form-group{display:flex;flex-direction:column;gap:8px}.form-label{font-size:.95rem;font-weight:600;color:var(--text-primary)}.form-desc{font-size:.8rem;color:var(--text-secondary);margin-top:-4px}.range-slider-container{display:flex;align-items:center;gap:16px;padding:12px 0}.range-slider{flex-grow:1;height:6px;background:var(--border);border-radius:var(--radius-full);outline:none;-webkit-appearance:none}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--primary);cursor:pointer;box-shadow:0 2px 6px #1e50dc4d;transition:all var(--transition-fast)}.range-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.range-value{font-size:1.25rem;font-weight:700;color:var(--primary);font-family:var(--font-heading);min-width:60px;text-align:right}.sales-history-dots{display:flex;gap:6px;align-items:center}.sales-dot{font-size:.775rem;font-weight:500;padding:2px 6px;border-radius:var(--radius-sm);background-color:var(--bg-app);border:1px solid var(--border)}.sales-dot.last{font-weight:700;border-color:var(--primary-medium);background-color:var(--primary-light);color:var(--primary)}.sales-dot.up{border-color:var(--success-border);background-color:var(--success-bg);color:var(--success)}.sales-dot.down{border-color:var(--danger-border);background-color:var(--danger-bg);color:var(--danger)}.details-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:24px}@media (max-width: 768px){.details-grid{grid-template-columns:minmax(0,1fr)}}.profile-card{background-color:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border);padding:32px 24px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}.profile-avatar{width:100px;height:100px;border-radius:var(--radius-full);background-color:var(--primary-light);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:2.25rem;font-weight:700;font-family:var(--font-heading);border:4px solid white;box-shadow:var(--shadow-md)}.profile-stats{width:100%;border-top:1px solid var(--border);padding-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:16px}.stat-item{display:flex;flex-direction:column;gap:4px}.stat-val{font-size:1.125rem;font-weight:700;color:var(--text-primary)}.stat-lbl{font-size:.75rem;color:var(--text-secondary)}.filter-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;background-color:var(--bg-card);padding:16px 24px;border-radius:var(--radius-md);border:1px solid var(--border)}.search-input{padding:8px 16px;border-radius:var(--radius-sm);border:1px solid var(--border);outline:none;font-family:var(--font-body);font-size:.9rem;width:100%;max-width:300px;transition:all var(--transition-fast)}.search-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #1e50dc1a}.filter-select{padding:8px 12px;border-radius:var(--radius-sm);border:1px solid var(--border);outline:none;background-color:#fff;font-family:var(--font-body);font-size:.9rem;color:var(--text-secondary);cursor:pointer}.filter-select:focus{border-color:var(--primary)}.mobile-header,.mobile-nav{display:none}.promoters-list-container{display:flex;flex-direction:column;gap:12px}@media (max-width: 768px){.sidebar{display:none}.app-container{flex-direction:column;padding-top:60px;padding-bottom:70px}.mobile-header{display:flex;justify-content:space-between;align-items:center;position:fixed;top:0;left:0;right:0;height:60px;background-color:var(--bg-card);border-bottom:1px solid var(--border);padding:0 16px;z-index:1000}.logo-icon-mobile{background:linear-gradient(135deg,var(--primary),hsl(var(--primary-hue),var(--primary-saturation),65%));color:#fff;width:32px;height:32px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center}.logo-text-mobile{font-family:var(--font-heading);font-size:1rem;font-weight:800;color:var(--text-primary)}.user-avatar-mobile{width:32px;height:32px;border-radius:var(--radius-full);background-color:var(--primary-medium);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:600;border:1px solid var(--border)}.mobile-nav{display:flex;justify-content:space-around;align-items:center;position:fixed;bottom:0;left:0;right:0;height:60px;background-color:var(--bg-card);border-top:1px solid var(--border);z-index:1000;padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -2px 10px #0000000d;overflow-x:auto;-webkit-overflow-scrolling:touch}.mobile-nav::-webkit-scrollbar{display:none}.mobile-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-secondary);font-size:.65rem;font-weight:500;gap:2px;cursor:pointer;flex:1;min-width:68px;height:100%;transition:all var(--transition-fast)}.mobile-nav-item.active{color:var(--primary);font-weight:600}.main-content{padding:16px;gap:20px}.page-header{flex-direction:column;align-items:flex-start;gap:12px}.header-title-group h1{font-size:1.5rem}.header-actions{width:100%;justify-content:flex-start}.filter-bar{flex-direction:column;align-items:stretch;padding:16px}.search-input{max-width:none}.filter-select{width:100%}.profile-card{padding:20px 16px}.profile-stats{grid-template-columns:1fr;gap:12px}.promoters-list-container{display:flex;flex-direction:row;width:100%;max-width:100%;overflow-x:auto;padding-bottom:8px;-webkit-overflow-scrolling:touch}.promoters-list-container>div{flex:0 0 240px}}.toast-container{position:fixed;top:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none}@media (max-width: 768px){.toast-container{top:16px;right:16px;left:16px}}.toast{padding:14px 20px;border-radius:var(--radius-md);background-color:var(--bg-card);border:1px solid var(--border);box-shadow:var(--shadow-lg),var(--shadow-glow);font-size:.9rem;font-weight:600;display:flex;align-items:center;gap:12px;pointer-events:auto;animation:slideIn .3s cubic-bezier(.16,1,.3,1) forwards;max-width:400px}.toast.success{border-color:var(--success-border);background-color:var(--success-bg);color:var(--success)}.toast.danger{border-color:var(--danger-border);background-color:var(--danger-bg);color:var(--danger)}.toast.warning{border-color:var(--warning-border);background-color:var(--warning-bg);color:var(--warning)}.toast.info{border-color:var(--primary-medium);background-color:var(--primary-light);color:var(--primary)}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.chart-scroll-container{width:100%;overflow-x:auto;overflow-y:hidden;display:flex;flex-direction:column;flex:1}.chart-scroll-inner{width:100%;height:100%;min-height:320px}.scrollable-container::-webkit-scrollbar{width:6px;height:6px}.scrollable-container::-webkit-scrollbar-track{background:transparent}.scrollable-container::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:3px}.scrollable-container::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@media (max-width: 768px){.chart-scroll-inner{min-width:600px}.card{padding:16px!important}.card-title-container{flex-wrap:wrap!important;gap:8px!important}.ranking-item{flex-direction:column;align-items:flex-start;gap:12px}.ranking-score-group{width:100%;flex-direction:row!important;justify-content:space-between;align-items:center!important;border-top:1px solid var(--border-light);padding-top:8px}}.promoter-horizontal-card{border:1px solid var(--border);padding:24px;display:flex;flex-direction:column;gap:20px}.promoter-horizontal-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);padding-bottom:16px;flex-wrap:wrap;gap:16px}.promoter-header-left{display:flex;align-items:center;gap:16px}.promoter-header-title{font-size:1.5rem;font-weight:800;margin:0;white-space:nowrap}.promoter-registry-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.promoter-registry-grid .address-field{grid-column:span 2}.promoter-registry-grid span{word-break:break-word;overflow-wrap:break-word}@media (max-width: 576px){.promoter-horizontal-card{padding:16px!important;gap:16px!important}.promoter-horizontal-header{flex-direction:column;align-items:flex-start!important;gap:12px!important;padding-bottom:12px!important}.promoter-header-left{gap:12px!important}.promoter-header-title{font-size:1.25rem!important}.promoter-registry-grid{grid-template-columns:1fr!important;gap:12px!important}.promoter-registry-grid .address-field{grid-column:span 1!important}}