:root{--primary: #5b7cfa;--light-gray: #f5f7fa;--medium-gray: #e4e9f2;--dark-gray: #6b778c;--text: #2e384d;--border: #d8dee9;--shadow: 0 4px 12px rgba(0, 0, 0, .05)}*{margin:0;padding:0;box-sizing:border-box;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}body{background-color:var(--light-gray);color:var(--text);line-height:1.6;padding:20px}.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-bottom:30px}.metric-card{background:#fff;border-radius:12px;padding:16px 48px 16px 16px;box-shadow:var(--shadow);transition:transform .3s;position:relative}.metric-card:hover{transform:translateY(-3px)}.metric-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.metric-title{font-size:.9rem;color:var(--dark-gray);font-weight:500}.metric-icon{width:56px;height:56px;position:absolute;top:50%;right:8%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;background:transparent;border-radius:0;opacity:.95;pointer-events:none}.metric-icon__warn{font-size:1.1rem;color:#444}.metric-value{font-size:1.4rem;line-height:1.6rem;font-weight:700;margin-bottom:4px}.metric-change{font-weight:500;font-size:.8rem}.metric-change__title{font-weight:600}.metric-change.negative{color:#f44336}.metric-change.warring{color:#ff9800}.charts{display:grid;grid-template-columns:2fr 1fr;gap:20px;margin-bottom:30px}.chart-container{background:#fff;border-radius:12px;padding:20px;box-shadow:var(--shadow)}.chart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.chart-title{font-size:1.1rem;font-weight:600}.chart-actions button{background:none;border:none;color:var(--dark-gray);cursor:pointer;font-size:1rem;margin-left:10px}.chart-placeholder{background:var(--light-gray);height:300px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--dark-gray);font-weight:500}.recent-activity{background:#fff;border-radius:12px;padding:20px;box-shadow:var(--shadow)}.activity-header{margin-bottom:20px}.activity-table{width:100%;border-collapse:collapse;font-size:.9rem}.activity-table th{text-align:left;padding:12px 15px;color:var(--dark-gray);font-weight:500;border-bottom:2px solid var(--border)}.activity-table td{padding:12px 15px;border-bottom:1px solid var(--border)}.status{padding:5px 10px;border-radius:20px;font-size:.8rem;font-weight:500;display:inline-block}.status.completed{background:#4caf501a;color:#4caf50}.status.pending{background:#ff98001a;color:#ff9800}.blur-box{width:300px;height:200px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-family:Arial,sans-serif;font-weight:700;margin:20px}.red-blur-bg{background-color:#ff00004d;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.yellow-blur-bg{background-color:#ff06;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.green-blur-bg{background-color:#00ff0040;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.slider-edge{position:fixed;top:0;bottom:0;width:8%;display:flex;align-items:center;justify-content:center;z-index:1000}.slider-edge.left{left:0}.slider-edge.right{right:0}.slider-edge .edge-btn{opacity:0;transform:translateY(0);transition:opacity .15s ease,transform .15s ease;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#ffffff80;border:1px solid rgba(0,0,0,.08);color:#000;padding:10px 14px;border-radius:10px;cursor:pointer;box-shadow:0 4px 12px #0000001f}.slider-edge:hover .edge-btn{opacity:1}.slider-edge.left .edge-btn{transform:translate(-6px)}.slider-edge.right .edge-btn{transform:translate(6px)}.slider-edge.left:hover .edge-btn,.slider-edge.right:hover .edge-btn{transform:translate(0)}.metric-change__link{display:block;font-size:.95rem}@media (max-width: 767px){.slider-edge{width:14%}.slider-edge .edge-btn{padding:8px 12px;border-radius:8px}}@media (max-width: 992px){.charts{grid-template-columns:1fr}}@media (max-width: 768px){.metrics{grid-template-columns:1fr}}.pagination-edge{position:fixed;top:0;bottom:0;width:8%;display:flex;align-items:center;justify-content:center;z-index:1000;pointer-events:auto}.pagination-edge-left{left:0}.pagination-edge-right{right:0}.pagination-edge-btn{opacity:0;transform:translateY(0);transition:opacity .15s ease,transform .15s ease;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#0000004d;border:1px solid rgba(0,0,0,.2);color:#fff;padding:12px 16px;border-radius:12px;cursor:pointer;box-shadow:0 4px 12px #0000004d;font-size:1.4rem;font-weight:700;pointer-events:auto;min-width:60px;height:60px;display:flex;align-items:center;justify-content:center}.pagination-edge-btn:disabled{opacity:0;cursor:not-allowed}.pagination-edge:hover .pagination-edge-btn{opacity:1}.pagination-edge-left .pagination-edge-btn{transform:translate(-8px)}.pagination-edge-right .pagination-edge-btn{transform:translate(8px)}.pagination-edge-left:hover .pagination-edge-btn,.pagination-edge-right:hover .pagination-edge-btn{transform:translate(0)}.metric-card .metric-icon{position:absolute;top:50%;right:8%;transform:translateY(-50%);width:56px;height:56px;display:flex;align-items:center;justify-content:center;opacity:.95;background:transparent;border-radius:0}.metric-icon i,.metric-icon span{background:transparent;border-radius:0;line-height:1}.metric-icon .metric-icon__fa{font-size:67px;display:block}.metric-icon .metric-icon__badge{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:10px;color:#fff;font-size:20px;font-weight:800}.metric-icon .metric-icon__warn{font-size:46px;color:#444;opacity:.9}.metric-value{text-align:center;margin-top:8px;font-weight:700}@media (max-width: 768px){.metric-icon{width:40px;height:40px;right:5%}.metric-icon__fa{font-size:32px}.metric-icon__badge{width:40px;height:40px;font-size:14px;border-radius:8px}.metric-icon__warn{font-size:22px}}@media (max-width: 480px){.metric-icon{width:48px;height:48px;right:3%}.metric-icon__fa{font-size:40px}.metric-icon__badge{width:48px;height:48px;font-size:16px;border-radius:8px}.metric-icon__warn{font-size:28px}}@media (min-width: 1200px){.metric-icon{width:64px;height:64px;right:15%}.metric-icon__fa{font-size:72px}.metric-icon__badge{width:64px;height:64px;font-size:24px;border-radius:12px}.metric-icon__warn{font-size:32px}}@media (max-width: 768px){.pagination-edge{width:14%}.pagination-edge-btn{padding:10px 14px;border-radius:10px;font-size:1.2rem;min-width:50px;height:50px}}
