:root{--color-bg-primary: #000;--color-bg-secondary: #111;--color-bg-tertiary: #1a1a1a;--color-border-primary: #222;--color-border-secondary: #333;--color-border-tertiary: #444;--color-text-primary: #fff;--color-text-secondary: #ccc;--color-text-tertiary: #999;--color-text-muted: #666;--color-text-subtle: #888;--color-success: #22c55e;--color-success-bg: rgba(34, 197, 94, .1);--color-danger: #ef4444;--color-danger-bg: rgba(239, 68, 68, .1);--color-warning: #f59e0b;--color-warning-bg: rgba(245, 158, 11, .1);--color-info: #3b82f6;--color-info-bg: rgba(59, 130, 246, .1);--spacing-xs: 8px;--spacing-sm: 12px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);--shadow-md: 0 4px 20px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--shadow-xl: 0 12px 40px rgba(255, 255, 255, .1);--shadow-glow: 0 4px 15px rgba(255, 255, 255, .2);--transition-fast: .2s ease;--transition-normal: .3s ease;--transition-slow: .5s ease}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}html,body{background-color:var(--color-bg-primary)!important;margin:0;padding:0;overflow-x:hidden;min-height:100vh}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Inter,sans-serif;line-height:1.6;color:var(--color-text-primary)}#root{background-color:var(--color-bg-primary)!important;min-height:100vh}.container{max-width:1400px;margin:0 auto;padding:clamp(20px,4vw,40px) clamp(15px,3vw,20px);background:var(--color-bg-primary);min-height:100vh;color:var(--color-text-primary)}.header{text-align:center;margin-bottom:clamp(30px,5vw,50px);padding:clamp(24px,5vw,40px) clamp(20px,4vw,30px);background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);border:1px solid var(--color-border-primary);opacity:0;transform:translateY(-20px);position:relative;overflow:hidden}.header:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.03),transparent);animation:shimmer 3s infinite}.header.fade-in-up{animation:fadeInUp .8s ease-out forwards}.title{font-size:clamp(1.75rem,5vw + .5rem,4rem);font-weight:800;margin:0 0 clamp(12px,2vw,16px) 0;color:var(--color-text-primary);text-shadow:0 4px 20px rgba(255,255,255,.1);text-transform:uppercase;letter-spacing:-.02em;line-height:1.1;word-break:break-word}.subtitle{font-size:clamp(.9rem,2vw + .2rem,1.5rem);color:var(--color-text-secondary);font-weight:400;margin:0;line-height:1.4}.message{padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);margin-bottom:var(--spacing-lg);display:flex;align-items:center;gap:var(--spacing-sm);animation:slideInLeft .5s ease-out;font-weight:500;font-size:clamp(.9rem,2vw,1rem);flex-wrap:wrap}.error-message{background:linear-gradient(135deg,#dc262633,#b91c1c1a);border:1px solid #dc2626;color:#fca5a5;box-shadow:0 4px 15px #dc262633}.error-boundary{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(40px,8vw,60px) clamp(20px,5vw,40px);background:linear-gradient(135deg,#dc26261a,#b91c1c0d);border:2px solid #dc2626;border-radius:var(--radius-lg);margin:var(--spacing-2xl) var(--spacing-md);gap:var(--spacing-lg);text-align:center}.error-boundary button{padding:var(--spacing-sm) var(--spacing-xl);background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:clamp(14px,2vw,15px);font-weight:600;transition:all var(--transition-normal);text-transform:uppercase;letter-spacing:.5px;box-shadow:var(--shadow-sm);min-height:44px;min-width:120px}.error-boundary button:hover{background:linear-gradient(135deg,#b91c1c,#991b1b);transform:translateY(-2px);box-shadow:0 6px 20px #dc262666}.error-boundary button:active{transform:translateY(0)}.main-content{margin-top:clamp(20px,4vw,30px)}.tab-navigation{display:flex;gap:clamp(8px,1.5vw,12px);margin-bottom:clamp(24px,4vw,40px);flex-wrap:wrap;padding:var(--spacing-xs);background:var(--color-bg-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border-primary)}.tab-button{display:flex;align-items:center;justify-content:center;gap:clamp(6px,1.5vw,10px);padding:clamp(12px,2vw,14px) clamp(16px,3vw,28px);background:transparent;border:none;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-normal);font-size:clamp(13px,2vw,15px);font-weight:600;font-family:inherit;text-transform:uppercase;letter-spacing:.5px;min-height:44px;flex:1;min-width:fit-content;white-space:nowrap}.tab-button:hover{background:#ffffff0d;color:var(--color-text-primary);transform:translateY(-2px)}.tab-button:active{transform:translateY(0)}.tab-button.active{background:linear-gradient(135deg,#fff,#e5e5e5);color:#000;box-shadow:var(--shadow-glow)}.mobile-optimized{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.period-selector{display:flex;align-items:center;gap:clamp(8px,2vw,12px);margin-bottom:clamp(24px,4vw,40px);flex-wrap:wrap;padding:clamp(16px,3vw,24px);background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%);border-radius:var(--radius-lg);border:1px solid var(--color-border-primary);box-shadow:var(--shadow-md)}.period-label{font-weight:700;color:var(--color-text-primary);font-size:clamp(13px,2vw,15px);text-transform:uppercase;letter-spacing:.5px;width:100%;margin-bottom:var(--spacing-xs)}.period-button{flex:1;min-width:calc(25% - 12px);padding:clamp(10px,2vw,12px) clamp(16px,3vw,24px);background:#222;border:2px solid var(--color-border-secondary);border-radius:var(--radius-sm);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-normal);font-size:clamp(12px,2vw,14px);font-weight:600;font-family:inherit;text-transform:uppercase;letter-spacing:.5px;min-height:44px;display:flex;align-items:center;justify-content:center}.period-button:hover:not(:disabled){background:var(--color-border-secondary);border-color:var(--color-border-tertiary);transform:translateY(-2px);box-shadow:0 4px 12px #ffffff1a}.period-button:active:not(:disabled){transform:translateY(0)}.period-button.active{background:linear-gradient(135deg,#fff,#e5e5e5);border-color:#fff;color:#000;box-shadow:var(--shadow-glow)}.period-button:disabled{opacity:.4;cursor:not-allowed}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(40px,8vw,80px) var(--spacing-md);gap:var(--spacing-lg);background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%);border-radius:var(--radius-lg);border:1px solid var(--color-border-primary);min-height:200px}.loading-container p{font-size:clamp(1rem,2vw,1.1rem);color:var(--color-text-secondary);font-weight:500;text-align:center}.animate-spin{animation:spin 1s linear infinite;color:var(--color-text-primary)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:clamp(16px,3vw,24px);margin-bottom:clamp(30px,5vw,50px)}.stat-card{background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%);padding:clamp(20px,4vw,28px);border-radius:var(--radius-lg);border:1px solid var(--color-border-primary);transition:all var(--transition-normal);opacity:0;transform:translateY(20px);position:relative;overflow:hidden;box-shadow:var(--shadow-md)}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,transparent,currentColor,transparent);opacity:0;transition:opacity var(--transition-normal)}.stat-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-xl);border-color:var(--color-border-secondary)}.stat-card:hover:before{opacity:1}.stat-card.fade-in-up{animation:fadeInUp .6s ease-out forwards}.stat-icon-container{margin-bottom:clamp(16px,3vw,20px)}.stat-icon{width:clamp(48px,10vw,56px);height:clamp(48px,10vw,56px);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#ffffff0d,#ffffff05);border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow-sm);transition:all var(--transition-normal)}.stat-icon svg{width:clamp(20px,5vw,24px);height:clamp(20px,5vw,24px)}.stat-card:hover .stat-icon{transform:scale(1.1);box-shadow:0 6px 20px #ffffff26}.stat-label{font-size:clamp(11px,2vw,13px);color:var(--color-text-tertiary);margin:0 0 clamp(8px,2vw,10px) 0;font-weight:600;text-transform:uppercase;letter-spacing:1px}.stat-value{font-size:clamp(1.8rem,5vw,2.2rem);font-weight:800;margin:0 0 clamp(6px,1.5vw,8px) 0;line-height:1;text-shadow:0 2px 10px rgba(255,255,255,.1);word-break:break-word}.stat-subtitle{font-size:clamp(11px,2vw,13px);color:var(--color-text-muted);margin:0 0 var(--spacing-sm) 0;font-weight:400}.stat-change{display:flex;align-items:center;gap:var(--spacing-xs);font-size:clamp(12px,2vw,14px);font-weight:600;margin-top:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);width:fit-content}.stat-change.positive{color:var(--color-success);background:var(--color-success-bg)}.stat-change.negative{color:var(--color-danger);background:var(--color-danger-bg)}.charts-section{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(500px,100%),1fr));gap:clamp(20px,4vw,30px)}.card{background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%);padding:clamp(20px,4vw,32px);border-radius:var(--radius-xl);border:1px solid var(--color-border-primary);animation-fill-mode:both;box-shadow:var(--shadow-md);transition:all var(--transition-normal)}.card:hover{border-color:var(--color-border-secondary);box-shadow:0 12px 40px #ffffff0d}.card.slide-in-left{animation:slideInLeft .8s ease-out}.card.slide-in-right{animation:slideInRight .8s ease-out}.chart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(20px,4vw,28px);flex-wrap:wrap;gap:var(--spacing-md);padding-bottom:clamp(16px,3vw,20px);border-bottom:1px solid var(--color-border-primary)}.tab-title{font-size:clamp(1.1rem,3vw,1.4rem);font-weight:700;margin:0;color:var(--color-text-primary);text-transform:uppercase;letter-spacing:.5px;word-break:break-word}.chart-period{font-size:clamp(11px,2vw,13px);color:var(--color-text-tertiary);background:#ffffff0d;padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-sm);font-weight:600;border:1px solid var(--color-border-primary);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.chart-container{height:clamp(250px,50vw,380px);position:relative;margin:clamp(16px,3vw,24px) 0;padding:clamp(8px,2vw,10px);background:#0000004d;border-radius:var(--radius-md)}.chart-stats{display:flex;justify-content:space-around;gap:clamp(12px,3vw,20px);margin-top:clamp(20px,4vw,28px);padding-top:clamp(16px,3vw,24px);border-top:1px solid var(--color-border-primary);flex-wrap:wrap}.chart-stat-item{display:flex;flex-direction:column;gap:var(--spacing-xs);padding:var(--spacing-md) clamp(16px,3vw,20px);background:#ffffff08;border-radius:var(--radius-md);border:1px solid var(--color-border-primary);flex:1;min-width:clamp(120px,30%,140px);transition:all var(--transition-normal)}.chart-stat-item:hover{background:#ffffff0d;border-color:var(--color-border-secondary);transform:translateY(-2px)}.chart-stat-label{font-size:clamp(11px,2vw,12px);color:var(--color-text-subtle);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.chart-stat-value{font-size:clamp(18px,4vw,20px);font-weight:800;color:var(--color-text-primary);text-shadow:0 2px 10px rgba(255,255,255,.1);word-break:break-word}.no-data-message{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(40px,8vw,80px) clamp(20px,4vw,30px);color:var(--color-text-muted);gap:var(--spacing-lg);text-align:center;background:#ffffff05;border-radius:var(--radius-md);border:1px dashed var(--color-border-secondary);min-height:200px}.no-data-message svg{opacity:.3;width:clamp(40px,10vw,48px);height:clamp(40px,10vw,48px)}.no-data-message p{font-size:clamp(1rem,2vw,1.1rem);font-weight:600;color:var(--color-text-tertiary);margin:0}.popular-products-list{margin-top:clamp(20px,4vw,32px);display:flex;flex-direction:column;gap:clamp(10px,2vw,14px)}.popular-product-item{display:grid;grid-template-columns:clamp(40px,10vw,50px) 1fr auto;align-items:center;gap:clamp(12px,3vw,18px);padding:clamp(12px,3vw,16px) clamp(16px,3vw,20px);background:#ffffff08;border-radius:var(--radius-md);border:1px solid var(--color-border-primary);transition:all var(--transition-normal)}.popular-product-item:hover{background:#ffffff0d;border-color:var(--color-border-secondary);transform:translate(6px);box-shadow:0 4px 15px #ffffff0d}.product-rank{font-size:clamp(16px,4vw,18px);font-weight:800;color:var(--color-text-primary);text-align:center;background:linear-gradient(135deg,#fff,#ccc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.product-name{font-size:clamp(13px,2.5vw,15px);color:var(--color-text-primary);font-weight:600;word-break:break-word;line-height:1.4}.product-sales{font-size:clamp(14px,3vw,16px);color:var(--color-success);font-weight:700;white-space:nowrap}.product-orders{font-size:clamp(11px,2vw,13px);color:var(--color-text-subtle);font-weight:500;grid-column:2 / -1;margin-top:-4px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-40px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes shimmer{0%{left:-100%}to{left:100%}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animation-delay-0{animation-delay:0ms}.animation-delay-100{animation-delay:.1s}.animation-delay-200{animation-delay:.2s}.animation-delay-300{animation-delay:.3s}.animation-delay-400{animation-delay:.4s}.animation-delay-500{animation-delay:.5s}.animation-delay-600{animation-delay:.6s}.animation-delay-700{animation-delay:.7s}.animation-delay-800{animation-delay:.8s}.animation-delay-900{animation-delay:.9s}.animation-delay-1000{animation-delay:1s}@media (max-width: 1024px){.charts-section{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}}@media (max-width: 768px){:root{font-size:15px}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:var(--spacing-md)}.period-selector{flex-direction:column;align-items:stretch}.period-label{width:100%;text-align:center}.period-button{width:100%;min-width:100%;justify-content:center}.tab-button{flex:1 1 auto;min-width:calc(50% - 6px)}.chart-header{flex-direction:column;align-items:flex-start}.chart-period{width:100%;text-align:center}.popular-product-item{grid-template-columns:clamp(35px,8vw,40px) 1fr auto;gap:var(--spacing-sm)}.chart-stats{flex-direction:column}.chart-stat-item{flex-direction:row;justify-content:space-between;align-items:center;min-width:100%}}@media (max-width: 480px){:root{font-size:14px}.container{padding:var(--spacing-md) var(--spacing-sm)}.header{padding:var(--spacing-lg) var(--spacing-md);border-radius:var(--radius-md)}.stats-grid{grid-template-columns:1fr;gap:var(--spacing-sm)}.stat-card{padding:var(--spacing-md)}.period-selector{padding:var(--spacing-md);gap:var(--spacing-sm)}.period-button{padding:var(--spacing-sm) var(--spacing-md);min-height:48px;font-size:13px}.tab-button{min-width:100%;padding:var(--spacing-sm) var(--spacing-md);font-size:13px}.card{padding:var(--spacing-md);border-radius:var(--radius-md)}.chart-container{height:clamp(220px,60vw,280px);padding:var(--spacing-xs)}.popular-products-list{gap:var(--spacing-sm)}.popular-product-item{padding:var(--spacing-sm) var(--spacing-md);grid-template-columns:35px 1fr;gap:var(--spacing-sm)}.product-sales,.product-orders{grid-column:2;font-size:13px}.product-sales{margin-bottom:4px}.product-orders{margin-top:0}}@media (max-width: 380px){:root{font-size:13px;--spacing-xs: 6px;--spacing-sm: 10px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 20px}.header{padding:var(--spacing-md) var(--spacing-sm);margin-bottom:var(--spacing-lg)}.title{font-size:1.5rem;letter-spacing:-.01em}.subtitle{font-size:.85rem;line-height:1.3}.tab-navigation{padding:4px;gap:6px}.tab-button{padding:10px 12px;font-size:12px;gap:6px;letter-spacing:.3px}.tab-button svg{width:16px;height:16px}.period-selector{padding:12px;gap:8px}.period-label{font-size:12px;margin-bottom:6px}.period-button{font-size:12px;padding:10px 12px;min-height:44px;letter-spacing:.3px}.stats-grid{gap:10px}.stat-card{padding:14px}.stat-icon-container{margin-bottom:12px}.stat-icon{width:40px;height:40px}.stat-icon svg{width:18px;height:18px}.stat-label{font-size:10px;margin-bottom:6px}.stat-value{font-size:1.5rem;margin-bottom:4px}.stat-subtitle{font-size:10px;margin-bottom:8px}.stat-change{font-size:11px;padding:6px 10px;gap:4px}.stat-change svg{width:14px;height:14px}.charts-section{gap:16px}.card{padding:var(--spacing-sm)}.chart-header{padding-bottom:var(--spacing-sm);margin-bottom:16px;gap:10px}.tab-title{font-size:1rem;letter-spacing:.3px}.chart-period{font-size:10px;padding:6px 10px}.chart-container{height:200px;padding:6px;margin:12px 0}.chart-stats{gap:10px;margin-top:16px;padding-top:16px}.chart-stat-item{padding:10px 12px;min-width:100%;gap:6px}.chart-stat-label{font-size:10px}.chart-stat-value{font-size:16px}.popular-products-list{margin-top:16px;gap:8px}.popular-product-item{grid-template-columns:32px 1fr;padding:10px 12px;gap:10px}.product-rank{font-size:14px}.product-name{font-size:12px;line-height:1.3}.product-sales{font-size:13px;margin-bottom:2px}.product-orders{font-size:10px}.no-data-message{padding:40px 16px;gap:12px}.no-data-message svg{width:36px;height:36px}.no-data-message p{font-size:.9rem}.loading-container{padding:40px 16px;gap:16px}.loading-container p{font-size:.9rem}.message{padding:12px 16px;font-size:.85rem;gap:10px}.message svg{width:18px;height:18px;flex-shrink:0}.error-boundary{padding:32px 16px;gap:16px;margin:20px 10px}.error-boundary svg{width:20px;height:20px}.error-boundary p{font-size:.9rem}.error-boundary button{padding:10px 20px;font-size:13px;min-height:44px;min-width:100px}}@media (max-width: 320px){:root{font-size:12px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 10px;--spacing-lg: 14px;--spacing-xl: 18px;--spacing-2xl: 24px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 10px;--radius-xl: 12px}.container{padding:12px 8px}.header{padding:12px 10px;margin-bottom:14px;border-radius:var(--radius-md)}.title{font-size:1.3rem;margin-bottom:8px;letter-spacing:0}.subtitle{font-size:.8rem;line-height:1.2}.tab-navigation{padding:3px;gap:4px;border-radius:var(--radius-sm)}.tab-button{padding:8px 10px;font-size:11px;gap:5px;border-radius:6px;letter-spacing:.2px}.tab-button svg{width:14px;height:14px}.period-selector{padding:10px 8px;gap:6px;border-radius:var(--radius-md)}.period-label{font-size:11px;margin-bottom:4px;letter-spacing:.3px}.period-button{font-size:11px;padding:9px 10px;min-height:42px;border-radius:6px;letter-spacing:.2px}.stats-grid{gap:8px;margin-bottom:20px}.stat-card{padding:12px;border-radius:var(--radius-md)}.stat-icon-container{margin-bottom:10px}.stat-icon{width:36px;height:36px;border-radius:var(--radius-sm)}.stat-icon svg{width:16px;height:16px}.stat-label{font-size:9px;margin-bottom:5px;letter-spacing:.5px}.stat-value{font-size:1.4rem;margin-bottom:3px}.stat-subtitle{font-size:9px;margin-bottom:6px}.stat-change{font-size:10px;padding:5px 8px;gap:3px;margin-top:8px}.stat-change svg{width:12px;height:12px}.charts-section{gap:14px}.card{padding:12px 10px;border-radius:var(--radius-md)}.chart-header{padding-bottom:10px;margin-bottom:14px;gap:8px}.tab-title{font-size:.95rem;letter-spacing:.2px}.chart-period{font-size:9px;padding:5px 8px;border-radius:6px;letter-spacing:.3px}.chart-container{height:180px;padding:5px;margin:10px 0;border-radius:var(--radius-sm)}.chart-stats{gap:8px;margin-top:14px;padding-top:14px}.chart-stat-item{padding:8px 10px;min-width:100%;gap:5px;border-radius:var(--radius-sm)}.chart-stat-label{font-size:9px;letter-spacing:.3px}.chart-stat-value{font-size:15px}.popular-products-list{margin-top:14px;gap:6px}.popular-product-item{grid-template-columns:28px 1fr;padding:8px 10px;gap:8px;border-radius:var(--radius-sm)}.product-rank{font-size:13px}.product-name{font-size:11px;line-height:1.2}.product-sales{font-size:12px;margin-bottom:2px}.product-orders{font-size:9px;margin-top:-2px}.no-data-message{padding:30px 12px;gap:10px;border-radius:var(--radius-sm)}.no-data-message svg{width:32px;height:32px}.no-data-message p{font-size:.85rem;line-height:1.3}.loading-container{padding:30px 12px;gap:14px;border-radius:var(--radius-md);min-height:160px}.loading-container svg{width:40px;height:40px}.loading-container p{font-size:.85rem}.message{padding:10px 12px;font-size:.8rem;gap:8px;border-radius:var(--radius-sm)}.message svg{width:16px;height:16px}.error-boundary{padding:24px 12px;gap:14px;margin:16px 8px;border-radius:var(--radius-md)}.error-boundary svg{width:18px;height:18px}.error-boundary p{font-size:.85rem;line-height:1.3}.error-boundary button{padding:9px 16px;font-size:12px;min-height:42px;min-width:90px;border-radius:6px}}@media (max-width: 280px){:root{font-size:11px}.container{padding:10px 6px}.header{padding:10px 8px;margin-bottom:12px}.title{font-size:1.2rem;margin-bottom:6px}.subtitle{font-size:.75rem}.tab-button{padding:7px 8px;font-size:10px;gap:4px}.tab-button svg{width:12px;height:12px}.period-selector{padding:8px 6px}.period-label{font-size:10px}.period-button{font-size:10px;padding:8px;min-height:40px}.stat-card{padding:10px}.stat-icon{width:32px;height:32px}.stat-icon svg{width:14px;height:14px}.stat-label{font-size:8px}.stat-value{font-size:1.3rem}.stat-subtitle{font-size:8px}.stat-change{font-size:9px;padding:4px 6px}.card{padding:10px 8px}.tab-title{font-size:.9rem}.chart-period{font-size:8px;padding:4px 6px}.chart-container{height:160px;padding:4px}.chart-stat-item{padding:7px 8px}.chart-stat-label{font-size:8px}.chart-stat-value{font-size:14px}.popular-product-item{grid-template-columns:26px 1fr;padding:7px 8px;gap:6px}.product-rank{font-size:12px}.product-name{font-size:10px}.product-sales{font-size:11px}.product-orders{font-size:8px}.no-data-message,.loading-container{padding:24px 10px}.no-data-message svg,.loading-container svg{width:28px;height:28px}.message{padding:8px 10px;font-size:.75rem}.error-boundary{padding:20px 10px;margin:12px 6px}.error-boundary button{font-size:11px;padding:8px 14px;min-height:40px;min-width:80px}}@media (max-height: 600px) and (orientation: landscape){.header{padding:var(--spacing-md) var(--spacing-lg);margin-bottom:var(--spacing-lg)}.title{font-size:1.75rem;margin-bottom:var(--spacing-sm)}.subtitle{font-size:.9rem}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:var(--spacing-sm)}.stat-card{padding:var(--spacing-md)}.stat-icon{width:40px;height:40px;margin-bottom:var(--spacing-sm)}.chart-container{height:280px}}@media print{*{-webkit-print-color-adjust:exact;print-color-adjust:exact}.tab-navigation,.period-selector{display:none}.container{background:#fff!important;color:#000!important;padding:20px}.stat-card,.card{break-inside:avoid;page-break-inside:avoid;border:1px solid #ddd!important;background:#fff!important;box-shadow:none!important;margin-bottom:20px}.header{background:#fff!important;color:#000!important;border:1px solid #ddd!important;box-shadow:none!important}.header:before{display:none}.title,.subtitle,.stat-label,.stat-value,.tab-title,.chart-stat-value{color:#000!important;text-shadow:none!important}.stat-change,.chart-period{border:1px solid #ddd!important}.charts-section{grid-template-columns:1fr}.chart-container{height:300px!important}.error-boundary,.loading-container{border:2px solid #ddd!important}}.tab-button:focus-visible,.period-button:focus-visible,.error-boundary button:focus-visible{outline:3px solid rgba(59,130,246,.6);outline-offset:2px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.header:before{animation:none!important}}@media (prefers-contrast: high){:root{--color-border-primary: #444;--color-border-secondary: #666;--color-text-secondary: #fff;--color-text-tertiary: #eee}.stat-card,.card{border-width:2px}.tab-button.active,.period-button.active{border:3px solid #fff}}@media (hover: none) and (pointer: coarse){.tab-button,.period-button{min-height:48px;padding:14px 20px}.stat-card:active{transform:scale(.98)}.popular-product-item:active{transform:translate(3px) scale(.99)}}@media (hover: hover) and (pointer: fine){.stat-card:hover,.chart-stat-item:hover,.popular-product-item:hover{cursor:pointer}}.skeleton{background:linear-gradient(90deg,#ffffff0d,#ffffff1a,#ffffff0d);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:var(--radius-sm)}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.mb-0{margin-bottom:0}.mb-1{margin-bottom:var(--spacing-xs)}.mb-2{margin-bottom:var(--spacing-sm)}.mb-3{margin-bottom:var(--spacing-md)}.mb-4{margin-bottom:var(--spacing-lg)}.mt-0{margin-top:0}.mt-1{margin-top:var(--spacing-xs)}.mt-2{margin-top:var(--spacing-sm)}.mt-3{margin-top:var(--spacing-md)}.mt-4{margin-top:var(--spacing-lg)}.hidden{display:none}.visible{display:block}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.stat-card,.card,.tab-button,.period-button,.popular-product-item{will-change:transform;transform:translateZ(0);backface-visibility:hidden}.stat-card.fade-in-up,.card.slide-in-left,.card.slide-in-right{will-change:auto}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-bg-secondary);border-radius:5px}::-webkit-scrollbar-thumb{background:var(--color-border-secondary);border-radius:5px;transition:background var(--transition-normal)}::-webkit-scrollbar-thumb:hover{background:var(--color-border-tertiary)}*{scrollbar-width:thin;scrollbar-color:var(--color-border-secondary) var(--color-bg-secondary)}