:root{--sidebar-bg:#112143;--sidebar-active:#1d3361;--bg-color:#f4f6f8;--card-bg:#fff;--text-main:#0b1a30;--text-muted:#6b778c;--chart-blue:#16325b;--chart-gray:#b0b8c1;--chart-light:#e0e4e8;--border-color:#e2e8f0;--accent-blue:#16325b;--accent-red:#ef4444;--font-main:"Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,sans-serif}html,body,#root{height:100%}body{background-color:var(--bg-color);color:var(--text-main)}.app-container{height:100vh;display:flex;overflow:hidden}.sidebar{background-color:var(--sidebar-bg);flex-direction:column;flex-shrink:0;align-items:center;width:70px;padding-top:20px;display:flex;position:relative}.sidebar .logo{background:#fff;border-radius:10px;justify-content:center;align-items:center;width:54px;height:54px;margin-bottom:30px;padding:6px;display:flex;overflow:hidden}.sidebar .logo img{object-fit:contain;max-width:100%;max-height:100%;display:block}.sidebar .menu-item{color:#8a9bb8;cursor:pointer;border-radius:8px;justify-content:center;align-items:center;width:50px;height:50px;margin-bottom:10px;font-size:18px;text-decoration:none;transition:all .3s;display:flex}.sidebar .menu-item.active{background-color:var(--sidebar-active);color:#fff}.sidebar .menu-item:hover{color:#fff}.sidebar .bottom-icon{color:#8a9bb8;font-size:18px;position:absolute;bottom:20px}.main-content{flex:1;min-width:0;padding:20px 30px;overflow-y:auto}header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:20px;display:flex}.header-title h1{color:var(--text-main);font-size:24px;font-weight:700}.header-title p{color:var(--text-muted);letter-spacing:.5px;margin-top:4px;font-size:12px;font-weight:600}.header-controls{flex-wrap:wrap;align-items:center;gap:15px;display:flex}.control-box{background:var(--card-bg);border:1px solid var(--border-color);border-radius:6px;flex-direction:column;min-width:160px;padding:8px 12px;display:flex}.control-box label{color:var(--text-muted);align-items:center;gap:5px;margin-bottom:4px;font-size:10px;display:flex}.control-box select{color:var(--text-main);cursor:pointer;background:0 0;border:none;outline:none;width:100%;font-size:13px;font-weight:500}.last-update{color:var(--text-muted);text-align:right;margin-left:15px;font-size:11px}.last-update strong{color:var(--text-main);font-weight:500;display:block}.export-wrap{position:relative}.export-btn{background:var(--chart-blue);color:#fff;cursor:pointer;border:none;border-radius:6px;justify-content:center;align-items:center;width:42px;height:42px;font-size:16px;transition:background .2s;display:flex}.export-btn:hover:not(:disabled){background:#0f2647}.export-btn:disabled{opacity:.7;cursor:default}.export-menu{border:1px solid var(--border-color);z-index:100;background:#fff;border-radius:8px;min-width:180px;padding:4px;position:absolute;top:50px;right:0;overflow:hidden;box-shadow:0 6px 24px #0b1a3026}.export-menu-title{text-transform:uppercase;color:var(--text-muted);letter-spacing:.5px;padding:8px 10px 4px;font-size:10px;font-weight:600}.export-menu button{cursor:pointer;width:100%;color:var(--text-main);text-align:left;background:0 0;border:none;border-radius:6px;align-items:center;gap:10px;padding:9px 10px;font-size:13px;display:flex}.export-menu button:hover{background:var(--bg-color)}.export-menu button i{text-align:center;width:18px;color:var(--chart-blue)}.kpi-row{grid-template-columns:repeat(5,1fr);gap:15px;margin-bottom:20px;display:grid}.kpi-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:8px;flex-direction:column;padding:15px;display:flex;position:relative}.kpi-header{align-items:center;gap:10px;margin-bottom:15px;display:flex}.kpi-header i{color:var(--chart-blue);text-align:center;width:22px;font-size:20px}.kpi-header span{color:var(--text-main);font-size:11px;font-weight:600}.kpi-value{color:var(--text-main);font-size:28px;font-weight:700}.kpi-meta{color:var(--text-muted);margin-top:5px;font-size:11px}.sparkline{width:100%;height:30px;margin-top:10px}.charts-grid{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:15px;margin-bottom:20px;display:grid}.chart-box{background:var(--card-bg);border:1px solid var(--border-color);border-radius:8px;min-width:0;padding:20px;position:relative}.chart-title{color:var(--text-main);align-items:center;gap:10px;margin-bottom:15px;font-size:12px;font-weight:600;display:flex}.chart-legend{color:var(--text-muted);gap:15px;font-size:11px;display:flex}.legend-item{align-items:center;gap:5px;display:flex}.legend-color{border-radius:2px;width:8px;height:8px}.chart-container{width:100%;min-width:0;height:220px;position:relative}.chart-container canvas{max-width:100%!important}.donut-flex{align-items:center;gap:14px;height:100%;display:flex}.donut-canvas-wrap{flex:0 0 46%;min-width:0;height:100%;position:relative}.donut-inner-icon{color:var(--chart-blue);background:#fff;border-radius:50%;justify-content:center;align-items:center;width:46px;height:46px;font-size:22px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.donut-legend-right{flex-direction:column;flex:1;gap:12px;min-width:0;display:flex}.donut-legend-item{justify-content:space-between;align-items:center;gap:8px;font-size:12px;display:flex}.donut-legend-label{color:var(--text-main);align-items:center;gap:8px;min-width:0;display:flex}.donut-legend-label span,.donut-legend-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.donut-legend-value{white-space:nowrap;font-weight:600}.table-section{background:var(--card-bg);border:1px solid var(--border-color);border-radius:8px;padding:20px;overflow-x:auto}.table-section table{min-width:620px}table{border-collapse:collapse;width:100%;font-size:12px}th,td{text-align:center;border-bottom:1px solid var(--border-color);padding:12px 8px}th{color:var(--text-muted);text-transform:uppercase;font-weight:600}td:first-child,th:first-child{text-align:left;width:180px}td:first-child i{width:20px;color:var(--text-muted);text-align:center;margin-right:5px}td:last-child,th:last-child{color:var(--text-main);font-weight:700}.state-msg{text-align:center;color:var(--text-muted);padding:80px 20px}.state-msg i{opacity:.3;margin-bottom:16px;font-size:56px}.state-msg p{margin-top:6px}.sheet-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.sheet-actions-bar{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.btn-import{border:1px solid var(--border-color);cursor:pointer;background:#fff;border-radius:6px;align-items:center;gap:8px;padding:10px 16px;font-size:14px;font-weight:600;display:flex}.btn-import:disabled{opacity:.5;cursor:default}.btn-import.replace{color:#b45309;border-color:#f59e0b}.btn-import.replace:hover:not(:disabled){background:#fffbeb}.btn-import.add{color:#15803d;border-color:#22c55e}.btn-import.add:hover:not(:disabled){background:#f0fdf4}.btn-download{background:var(--chart-blue);color:#fff;cursor:pointer;border:none;border-radius:6px;align-items:center;gap:8px;padding:10px 18px;font-size:14px;font-weight:600;display:flex}.btn-download:hover:not(:disabled){background:#0f2647}.btn-download:disabled{opacity:.5;cursor:default}.sheet-scroll{border:1px solid var(--border-color);background:#fff;border-radius:8px;max-height:calc(100vh - 170px);overflow:auto}.sheet-table{border-collapse:collapse;white-space:nowrap;width:100%;font-size:12px}.sheet-table th,.sheet-table td{border:1px solid var(--border-color);text-align:left;padding:8px 10px}.sheet-table thead th{background:var(--bg-color);color:var(--text-main);z-index:1;font-weight:600;position:sticky;top:0}.sheet-table tbody tr:nth-child(2n){background:#fafbfc}.sheet-table tbody tr:hover{background:#eef2f7}.sheet-rownum{color:var(--text-muted);background:var(--bg-color);z-index:1;font-weight:600;position:sticky;left:0;text-align:center!important}.sheet-table tbody td.sheet-rownum{background:#fff}.sheet-actions-col{text-align:center!important}.sheet-actions{white-space:nowrap;text-align:center}.row-btn{cursor:pointer;background:0 0;border:none;border-radius:5px;width:26px;height:26px;margin:0 2px;font-size:12px}.row-btn.edit{color:var(--chart-blue)}.row-btn.edit:hover{background:#16325b1a}.row-btn.del{color:#dc2626}.row-btn.del:hover{background:#dc26261a}.modal-overlay{z-index:1000;background:#0b1a3073;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:10px;flex-direction:column;width:100%;max-width:900px;max-height:90vh;display:flex;box-shadow:0 12px 40px #0b1a304d}.modal-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.modal-header h3{color:var(--text-main);font-size:16px;font-weight:700}.modal-close{cursor:pointer;color:var(--text-muted);background:0 0;border:none;font-size:18px}.modal-close:hover{color:var(--text-main)}.modal-body{padding:20px;overflow-y:auto}.modal-footer{border-top:1px solid var(--border-color);justify-content:flex-end;gap:10px;padding:14px 20px;display:flex}.btn-secondary{color:var(--text-main);border:1px solid var(--border-color);cursor:pointer;background:#fff;border-radius:6px;padding:10px 20px;font-size:14px;font-weight:600}.btn-secondary:hover:not(:disabled){background:var(--bg-color)}.form-container{background:var(--card-bg);border:1px solid var(--border-color);border-radius:8px;max-width:900px;margin:0 auto;padding:30px}.form-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.form-group{flex-direction:column;gap:4px;display:flex}.form-group.full-width{grid-column:1/-1}.form-group label{color:var(--text-muted);font-size:.82rem;font-weight:600}.form-group input,.form-group select,.form-group textarea{border:1px solid var(--border-color);color:var(--text-main);background:#fff;border-radius:6px;outline:none;padding:10px 12px;font-family:inherit;font-size:.9rem;transition:border-color .2s}.form-group input:focus,.form-group select:focus{border-color:var(--chart-blue)}.btn-primary{background:var(--chart-blue);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:11px 28px;font-size:.9rem;font-weight:700;transition:background .2s}.btn-primary:hover{background:#0f2647}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}@media (width<=1200px){.kpi-row{grid-template-columns:repeat(3,1fr)}.charts-grid{grid-template-columns:minmax(0,1fr)}}@media (width<=768px){html,body,#root{height:auto}.app-container{flex-direction:column;height:auto;overflow:visible}.main-content{height:auto;padding:14px 14px 84px;overflow:visible}.sidebar{border-top:1px solid var(--border-color);z-index:100;flex-direction:row;justify-content:space-around;align-items:center;gap:6px;width:100%;height:auto;padding:8px 10px;position:fixed;inset:auto 0 0;box-shadow:0 -2px 12px #0b1a3026}.sidebar .logo,.sidebar .bottom-icon{display:none}.sidebar .menu-item{width:52px;height:44px;margin-bottom:0}header{flex-direction:column;align-items:stretch}.header-title h1{font-size:19px}.header-controls{width:100%}.control-box{flex:140px;min-width:0}.last-update{text-align:left;margin-left:0}.kpi-row{grid-template-columns:repeat(2,1fr);gap:12px}.kpi-value{font-size:24px}.chart-box{padding:14px}.form-grid{grid-template-columns:1fr}.form-container{padding:20px}.sheet-actions-bar{width:100%}.sheet-actions-bar .btn-import,.sheet-actions-bar .btn-download{flex:auto;justify-content:center}}@media (width<=520px){.kpi-row{grid-template-columns:1fr}.header-title h1{font-size:17px}.chart-container{height:200px}.modal-body{padding:14px}}