:root{--primary:#10b981;--primary-hover:#059669;--accent:#10b981;--accent-light:rgba(16,185,129,.1);--bg-main:#0b0f19;--bg-card:#111827;--border:#1f2937;--border-focus:#10b981;--text-main:#f9fafb;--text-muted:#9ca3af;--text-light:#6b7280;--font-arabic:"Cairo",sans-serif;--font-english:"Inter",sans-serif;--shadow-card:0 4px 20px -2px rgba(0,0,0,.3),0 2px 6px -1px rgba(0,0,0,.2);--shadow-hover:0 20px 25px -5px rgba(0,0,0,.5),0 10px 10px -5px rgba(0,0,0,.3)}body{background-color:var(--bg-main);color:var(--text-main);font-family:var(--font-arabic);margin:0;padding:0;line-height:1.6;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#111827}::-webkit-scrollbar-thumb{background:#374151;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#4b5563}.wrapper{min-height:100vh;display:flex;flex-direction:column}.main-header{background-color:rgba(11,15,25,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border);position:-webkit-sticky;position:sticky;top:0;z-index:100;transition:all .3s}.header-container{max-width:1200px;margin:0 auto;padding:18px 24px;display:flex;justify-content:space-between;align-items:center}.logo-text{font-size:22px;font-weight:900;color:#fff;letter-spacing:1px;text-decoration:none}.logo-badge{font-size:10px;background-color:var(--accent);color:#0b0f19;padding:3px 8px;border-radius:4px;margin-right:6px;font-weight:800}.nav-links{display:flex;gap:24px}.nav-link{text-decoration:none;color:var(--text-muted);font-size:14px;font-weight:700;transition:color .2s}.nav-link:hover{color:#fff}.content{flex:1 1;max-width:1200px;width:100%;margin:0 auto;padding:40px 24px;box-sizing:border-box}@media (max-width:600px){.content{padding:20px 16px}}.hero-section{text-align:center;margin-bottom:50px;padding:60px 24px;background:linear-gradient(135deg,#111827,#0f172a);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-card)}.hero-section h1{font-size:36px;font-weight:800;margin:0 0 16px;border:none;padding:0;letter-spacing:-.5px;color:#fff}.hero-section p{color:var(--text-muted);font-size:16px;max-width:700px;margin:0 auto;line-height:1.8}input[type=number],input[type=password],input[type=text],input[type=url],select,textarea{width:100%;border:1px solid var(--border);padding:14px 18px;font-size:15px;font-family:inherit;outline:none;box-sizing:border-box;background-color:#1f2937;color:var(--text-main);border-radius:8px;transition:border-color .2s,box-shadow .2s}input:focus,select:focus,textarea:focus{border-color:var(--border-focus);box-shadow:0 0 0 4px rgba(16,185,129,.15)}input.ltr,textarea.ltr{text-align:left;direction:ltr;font-family:var(--font-english)}button{background-color:var(--accent);color:#0b0f19;border:1px solid var(--accent);padding:14px 28px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;width:100%;box-sizing:border-box;border-radius:8px;transition:all .2s}button:hover{background-color:var(--primary-hover);border-color:var(--primary-hover);color:#fff}button.secondary{background-color:transparent;color:#fff;border:1px solid var(--border)}button.secondary:hover{background-color:#1f2937;border-color:var(--text-muted)}.filter-bar{display:flex;gap:12px;margin-bottom:40px;justify-content:center;flex-wrap:wrap}.filter-btn{background-color:#111827;color:var(--text-muted);border:1px solid var(--border);padding:10px 22px;font-size:14px;font-weight:700;cursor:pointer;border-radius:30px;width:auto;transition:all .2s;box-shadow:var(--shadow-sm)}.filter-btn.active,.filter-btn:hover{background-color:var(--accent);color:#0b0f19;border-color:var(--accent)}.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));grid-gap:30px;gap:30px}@media (max-width:600px){.tools-grid{grid-template-columns:1fr}}.tool-card{background-color:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:35px;display:flex;flex-direction:column;justify-content:space-between;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-card)}.tool-card:hover{transform:translateY(-5px);border-color:var(--accent);box-shadow:0 10px 30px rgba(16,185,129,.15)}.tool-card-title{font-size:20px;font-weight:800;margin:0 0 12px;color:#fff}.tool-card-desc{font-size:14px;line-height:1.7;margin:0 0 30px}.badge,.tool-card-desc{color:var(--text-muted)}.badge{font-size:11px;font-weight:700;padding:3px 10px;border-radius:30px;background-color:#1f2937;display:inline-block;margin-bottom:20px}.badge.primary{background-color:rgba(16,185,129,.15);color:var(--accent)}.badge.online{background-color:rgba(16,185,129,.1);color:#10b981}.tool-page-layout{display:grid;grid-template-columns:3.2fr 1.2fr;grid-gap:30px;gap:30px}@media (max-width:1024px){.tool-page-layout{grid-template-columns:1fr}}.tool-container{background-color:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:45px;box-shadow:var(--shadow-card)}@media (max-width:600px){.tool-container{padding:24px 16px}}.tool-sidebar{display:flex;flex-direction:column;gap:24px}.sidebar-box{background-color:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:25px;box-shadow:var(--shadow-card)}.sidebar-box h4{margin:0 0 20px;border-bottom:1px solid var(--border);padding-bottom:12px;font-size:16px;font-weight:800;color:#fff}.dropzone{border:2px dashed var(--border);padding:40px 20px;text-align:center;cursor:pointer;background-color:#1f2937;border-radius:8px;transition:all .2s;color:var(--text-muted)}.dropzone:hover{border-color:var(--accent);background-color:#111827}.diff-container{display:grid;grid-template-columns:1fr 1fr;grid-gap:24px;gap:24px;margin-bottom:25px}@media (max-width:768px){.diff-container{grid-template-columns:1fr}}.diff-panel h4{margin:0 0 12px;font-size:14px;font-weight:700}.diff-output{border:1px solid var(--border);background-color:#1f2937;padding:20px;border-radius:6px;min-height:180px;font-family:var(--font-english);white-space:pre-wrap;word-break:break-all;color:var(--text-main)}.diff-added{background-color:rgba(16,185,129,.2);color:#34d399;font-weight:600}.diff-removed{background-color:rgba(239,68,68,.2);color:#f87171;font-weight:600}.tool-documentation{margin-top:50px;border-top:1px solid var(--border);padding-top:40px}.tool-documentation h3{font-size:20px;font-weight:800;margin:0 0 20px;color:#fff}.tool-documentation li,.tool-documentation p{font-size:14px;color:var(--text-muted);line-height:1.8}.tool-documentation ul{padding-right:20px}.toast-msg{position:fixed;bottom:30px;left:30px;background-color:#111827;color:#fff;padding:14px 28px;border-radius:8px;font-weight:700;font-size:14px;box-shadow:var(--shadow-lg);z-index:1000;border:1px solid var(--accent)}.footer{background-color:#0b0f19;border-top:1px solid var(--border);padding:60px 24px}.footer-container{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center}.footer-brand h3{font-size:22px;font-weight:800;margin:0 0 12px;letter-spacing:.5px;color:#fff}.footer-brand p{font-size:15px;color:var(--text-muted);margin:0 0 35px;max-width:500px}.footer-bottom{border-top:1px solid var(--border);width:100%;padding-top:30px}.footer-bottom p{margin:5px 0;font-size:14px;font-weight:700;color:#fff}.footer-sub{font-size:11px;color:var(--text-light)}.score-circle{width:100px;height:100px;border-radius:50%;border:8px solid var(--border);display:flex;justify-content:center;align-items:center;font-size:24px;font-weight:800;margin:0 auto 20px}.score-good{border-color:#10b981;color:#10b981}.score-average{border-color:#f59e0b;color:#f59e0b}.score-bad{border-color:#ef4444;color:#ef4444}