*{box-sizing:border-box;margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}body{background-color:#f5f5f5;color:#333;direction:rtl;min-height:100vh}#root{min-height:100vh}.app-bar h1{font-size:24px}.app-bar button{background:#ffffff1a;border:none;color:#fff;font-size:16px;cursor:pointer;padding:8px 16px;border-radius:8px;display:flex;align-items:center;gap:8px;transition:background .3s}.app-bar button:hover{background:#fff3}main{padding:24px;max-width:1400px;margin:0 auto}.welcome-card{display:flex;align-items:center;background:linear-gradient(135deg,#3f51b5,#9c27b0);border-radius:16px;padding:24px;color:#fff;margin-bottom:32px;box-shadow:0 4px 20px #3f51b54d}.welcome-icon{background-color:#fff3;padding:16px;border-radius:12px;font-size:40px;margin-left:24px;display:flex;align-items:center;justify-content:center}.welcome-text h2{font-size:26px;font-weight:700;margin-bottom:8px}.welcome-text p{font-size:16px;opacity:.8}.stat-icon{font-size:36px;margin-left:16px;width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:12px}.stat-info h3{font-size:28px;font-weight:700;color:#333}.stat-info p{font-size:14px;color:#666}.action-btn{background:#fff;border-radius:12px;padding:24px;text-align:center;cursor:pointer;font-weight:600;box-shadow:0 2px 10px #0000000d;transition:transform .3s,box-shadow .3s;display:flex;flex-direction:column;align-items:center;gap:12px;border:none;font-size:14px;color:#333}.action-btn:hover{transform:translateY(-5px);box-shadow:0 8px 25px #0000001a}.action-btn i{font-size:28px}.tool-card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 10px #0000000d;cursor:pointer;transition:transform .3s,box-shadow .3s;display:flex;align-items:center;gap:12px;font-weight:500}.tool-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px #0000001a}.tool-card i{font-size:20px;color:#3f51b5;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#3f51b51a;border-radius:10px}.loading{display:flex;align-items:center;justify-content:center;padding:40px}.loading-spinner{width:40px;height:40px;border:4px solid rgba(63,81,181,.1);border-top-color:#3f51b5;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:fadeInUp .5s ease-out}@media(max-width:768px){.app-bar{padding:12px 16px}.app-bar h1{font-size:18px}main{padding:16px}.welcome-card{flex-direction:column;text-align:center}.welcome-icon{margin-left:0;margin-bottom:16px}.actions-grid{grid-template-columns:repeat(2,1fr)}}.app-bar{display:flex;justify-content:space-between;align-items:center;background-color:#3f51b5;color:#fff;padding:16px 32px;position:sticky;top:0;z-index:100;box-shadow:0 2px 10px #0000001a}.app-bar h1{font-size:24px;margin:0}.app-bar button{background:#ffffff1a;border:none;color:#fff;font-size:16px;cursor:pointer;padding:10px 20px;border-radius:8px;display:flex;align-items:center;gap:8px;transition:background .3s,transform .2s}.app-bar button:hover{background:#fff3;transform:scale(1.02)}.app-bar button:active{transform:scale(.98)}.app-bar button i{transition:transform .3s}.app-bar button:hover i{transform:rotate(180deg)}.welcome-card{display:flex;align-items:center;background:linear-gradient(135deg,#3f51b5,#9c27b0);border-radius:16px;padding:28px;color:#fff;margin-bottom:32px;box-shadow:0 4px 20px #3f51b54d;transition:transform .3s,box-shadow .3s}.welcome-card:hover{transform:translateY(-3px);box-shadow:0 8px 30px #3f51b566}.welcome-icon{background-color:#fff3;padding:20px;border-radius:16px;font-size:40px;margin-left:24px;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.welcome-text h2{font-size:28px;font-weight:700;margin-bottom:8px}.welcome-text p{font-size:16px;opacity:.85}@media(max-width:768px){.welcome-card{flex-direction:column;text-align:center;padding:24px}.welcome-icon{margin-left:0;margin-bottom:16px}.welcome-text h2{font-size:22px}}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:32px}.stat-card{display:flex;align-items:center;background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 10px #0000000d;transition:transform .3s,box-shadow .3s;cursor:pointer}.stat-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px #0000001a}.stat-icon{font-size:28px;margin-left:16px;width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:12px;transition:transform .3s}.stat-card:hover .stat-icon{transform:scale(1.1)}.stat-icon.blue{background:#2196f31a;color:#2196f3}.stat-icon.green{background:#4caf501a;color:#4caf50}.stat-icon.orange{background:#ff98001a;color:#ff9800}.stat-icon.purple{background:#9c27b01a;color:#9c27b0}.stat-info h3{font-size:28px;font-weight:700;color:#333;margin:0}.stat-info p{font-size:14px;color:#666;margin:4px 0 0}.stat-card.skeleton{pointer-events:none}.skeleton-icon{width:60px;height:60px;border-radius:12px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;margin-left:16px}.skeleton-info{flex:1}.skeleton-number{width:60px;height:28px;border-radius:4px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;margin-bottom:8px}.skeleton-text{width:80px;height:14px;border-radius:4px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media(max-width:600px){.stats-grid{grid-template-columns:repeat(2,1fr)}.stat-card{padding:16px}.stat-icon{width:48px;height:48px;font-size:22px}.stat-info h3{font-size:22px}}.actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:32px}.action-btn{background:#fff;border-radius:12px;padding:24px 16px;text-align:center;cursor:pointer;font-weight:600;box-shadow:0 2px 10px #0000000d;transition:transform .3s,box-shadow .3s;display:flex;flex-direction:column;align-items:center;gap:12px;border:none;font-size:14px;color:#333;font-family:inherit}.action-btn:hover{transform:translateY(-5px);box-shadow:0 8px 25px #0000001f}.action-btn:active{transform:translateY(-2px)}.action-btn i{font-size:28px;transition:transform .3s}.action-btn:hover i{transform:scale(1.15)}.action-btn.blue{border-right:4px solid #2196f3}.action-btn.blue i{color:#2196f3}.action-btn.blue:hover{background:#2196f30d}.action-btn.green{border-right:4px solid #4caf50}.action-btn.green i{color:#4caf50}.action-btn.green:hover{background:#4caf500d}.action-btn.orange{border-right:4px solid #ff9800}.action-btn.orange i{color:#ff9800}.action-btn.orange:hover{background:#ff98000d}.action-btn.purple{border-right:4px solid #9c27b0}.action-btn.purple i{color:#9c27b0}.action-btn.purple:hover{background:#9c27b00d}.action-btn.red{border-right:4px solid #f44336}.action-btn.red i{color:#f44336}.action-btn.red:hover{background:#f443360d}.action-btn.grey{border-right:4px solid #9e9e9e}.action-btn.grey i{color:#9e9e9e}.action-btn.grey:hover{background:#9e9e9e0d}@media(max-width:768px){.actions-grid{grid-template-columns:repeat(3,1fr)}.action-btn{padding:16px 8px}.action-btn i{font-size:24px}.action-btn span{font-size:12px}}@media(max-width:480px){.actions-grid{grid-template-columns:repeat(2,1fr)}}.tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.tool-card{background:#fff;padding:20px 24px;border-radius:12px;box-shadow:0 2px 10px #0000000d;cursor:pointer;transition:transform .3s,box-shadow .3s;display:flex;align-items:center;gap:16px;font-weight:500;color:#333}.tool-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px #0000001f}.tool-card:active{transform:translateY(-2px)}.tool-card i{font-size:20px;color:#3f51b5;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#3f51b51a;border-radius:10px;transition:transform .3s,background .3s}.tool-card:hover i{transform:scale(1.1);background:#3f51b526}.tool-card span{flex:1}@media(max-width:600px){.tools-grid{grid-template-columns:1fr}.tool-card{padding:16px 20px}}.app{min-height:100vh;background-color:#f5f5f5}.section-title{font-size:20px;font-weight:700;margin-bottom:16px;color:#333}
