*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f5f5f5;margin:0;font-family:system-ui,-apple-system,sans-serif}#root{width:100%;height:100vh}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#f0f0f0}::-webkit-scrollbar-thumb{background:silver;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#a0a0a0}.app{color:#1e293b;background:#f5f5f5;height:100vh;display:flex;overflow:hidden}.panel{flex-direction:column;display:flex;overflow:hidden}.panel--left{background:#fff;border-right:1px solid #e2e8f0;flex-shrink:0;width:300px;overflow-y:auto}.panel--center{flex-direction:column;flex:1 1 0;gap:12px;min-width:200px;padding:12px;display:flex;position:relative}.panel--center-split{flex-direction:column;display:flex}.center-graph{background:#fff;border-radius:16px;flex:1;min-height:0;position:relative;overflow:hidden;box-shadow:0 1px 4px #00000014}.center-graph--full{height:100%}.panel--center-split .center-graph{flex:0 0 50%}.center-compare{background:#fff;border-radius:16px;flex:none;max-height:50%;overflow-y:auto;box-shadow:0 1px 4px #00000014}.panel--right{background:#fff;border-left:1px solid #e2e8f0;flex-shrink:0;width:340px;overflow-y:auto}.mobile-redirect{background:#f5f5f5;justify-content:center;align-items:center;height:100vh;padding:24px;display:flex}.mobile-redirect__card{text-align:center;background:#fff;border-radius:20px;width:100%;max-width:360px;padding:40px 32px;box-shadow:0 4px 24px #00000014}.mobile-redirect__logo{border-radius:16px;width:72px;height:72px;margin-bottom:20px}.mobile-redirect__title{color:#1e293b;margin:0 0 16px;font-size:24px;font-weight:700}.mobile-redirect__message{color:#475569;margin:0 0 8px;font-size:15px;line-height:1.6}.mobile-redirect__sub{color:#94a3b8;margin:0 0 24px;font-size:13px}.mobile-redirect__button{color:#fff;background:#1e293b;border-radius:12px;padding:12px 32px;font-size:15px;font-weight:600;text-decoration:none;transition:background .15s;display:inline-block}.mobile-redirect__button:hover{background:#334155}.loading-screen{color:#64748b;background:#f5f5f5;flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100vh;display:flex}.loading-spinner{border:3px solid #e2e8f0;border-top-color:#6366f1;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.surah-browser{flex-direction:column;height:100%;display:flex}.surah-browser__header{border-bottom:1px solid #e2e8f0;padding:16px}.surah-browser__header h2{color:#1e293b;margin:0 0 12px;font-size:18px;font-weight:700}.surah-search{color:#1e293b;box-sizing:border-box;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;outline:none;width:100%;padding:8px 12px;font-size:14px}.surah-search:focus{border-color:#6366f1;box-shadow:0 0 0 2px #6366f126}.surah-list{flex:1;overflow-y:auto}.surah-header{color:#1e293b;cursor:pointer;text-align:left;background:0 0;border:none;border-bottom:1px solid #f1f5f9;align-items:center;gap:10px;width:100%;padding:10px 16px;font-size:14px;transition:background .15s;display:flex}.surah-header:hover{background:#f8fafc}.surah-header--active{color:#6366f1;background:#f1f5f9}.surah-num{color:#64748b;background:#f1f5f9;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:12px;font-weight:600;display:flex}.surah-name{flex:1;font-weight:500}.surah-ayah-count{color:#94a3b8;font-size:12px}.search-result-count{color:#94a3b8;margin-top:8px;font-size:12px}.search-result-item{border-bottom:1px solid #e2e8f0}.search-result-ref{color:#6366f1;padding:8px 16px 0;font-size:12px;font-weight:600}.ayah-list{background:#fafbfc;border-bottom:1px solid #e2e8f0}.ayah-card{border-bottom:1px solid #f1f5f9;align-items:flex-start;gap:8px;padding:10px 16px;display:flex}.ayah-number{color:#64748b;background:#e2e8f0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;min-width:28px;height:28px;margin-top:4px;font-size:11px;font-weight:600;display:flex}.arabic-text{text-align:right;color:#1e293b;flex:1;font-family:Amiri,Traditional Arabic,Scheherazade New,serif;font-size:1.3rem;line-height:2.2}.arabic-word{cursor:pointer;border-radius:4px;padding:2px 4px;transition:background .15s}.arabic-word:hover{background:#6366f11f}.arabic-word--selected{color:#4f46e5;background:#6366f12e}.graph-view{width:100%;height:100%;position:relative;overflow:hidden}.graph-view--empty{background:#fff;justify-content:center;align-items:center;display:flex}.graph-placeholder{text-align:center;color:#94a3b8;font-size:16px;line-height:1.8}.graph-placeholder .graph-word{color:#6366f1;margin-bottom:12px;font-family:Amiri,serif;font-size:2.5rem;display:block}.graph-controls{z-index:10;pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute;top:12px;left:12px;right:12px}.graph-controls .graph-word{color:#6366f1;pointer-events:auto;background:#ffffffe6;border-radius:10px;padding:4px 16px;font-family:Amiri,serif;font-size:1.8rem;box-shadow:0 1px 4px #00000014}.graph-stats{color:#64748b;background:#ffffffe6;border-radius:10px;align-items:center;gap:10px;padding:6px 14px;font-size:13px;display:flex;box-shadow:0 1px 4px #00000014}.graph-load-more{color:#6366f1;cursor:pointer;pointer-events:auto;background:#6366f11a;border:1px solid #6366f14d;border-radius:4px;padding:3px 10px;font-size:12px;transition:background .15s}.graph-load-more:hover{background:#6366f133}.detail-panel{padding:20px}.detail-panel--empty{color:#94a3b8;text-align:center;justify-content:center;align-items:center;height:100%;padding:20px;display:flex}.detail-header h3{color:#1e293b;margin:0 0 16px;font-size:16px;font-weight:700}.detail-arabic{text-align:right;color:#1e293b;background:#f8fafc;border-radius:10px;margin-bottom:16px;padding:16px;font-family:Amiri,serif;font-size:1.5rem;line-height:2.4}.highlight-word{color:#4f46e5;background:#6366f12e;border-radius:4px;padding:2px 4px}.detail-translation{margin-bottom:16px}.detail-translation h4{color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px;font-size:13px;font-weight:600}.detail-translation p{color:#475569;margin:0;font-size:14px;line-height:1.7}.detail-explanations{border-top:1px solid #e2e8f0;padding-top:12px}.explanation-toggle{color:#64748b;cursor:pointer;background:0 0;border:1px solid #e2e8f0;border-radius:8px;padding:6px 14px;font-size:13px;transition:all .15s}.explanation-toggle:hover{color:#1e293b;background:#f1f5f9}.explanation-text{color:#64748b;background:#f8fafc;border-radius:8px;margin-top:12px;padding:12px;font-size:13px;line-height:1.8}.compare-panel{flex-direction:column;height:100%;display:flex}.compare-panel__toolbar{border-bottom:1px solid #e2e8f0;flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.compare-panel__title{color:#1e293b;align-items:center;gap:8px;font-size:14px;font-weight:700;display:flex}.compare-panel__word{color:#6366f1;font-family:Amiri,serif;font-size:1.2rem}.compare-panel__close{color:#64748b;cursor:pointer;background:0 0;border:1px solid #e2e8f0;border-radius:6px;padding:4px 12px;font-size:12px;transition:all .15s}.compare-panel__close:hover{color:#1e293b;background:#f1f5f9}.compare-body{flex:1;min-height:0;display:flex;overflow-y:auto}.compare-column{flex:1;min-width:0;padding:12px 16px}.compare-column__header{align-items:center;gap:8px;margin-bottom:10px;display:flex}.compare-badge{text-transform:uppercase;letter-spacing:.5px;border-radius:4px;padding:2px 8px;font-size:11px;font-weight:600}.compare-badge--source{color:#6366f1;background:#6366f11f}.compare-badge--target{color:#059669;background:#10b9811f}.compare-ref{color:#475569;font-size:13px;font-weight:500}.compare-arabic{text-align:right;color:#1e293b;background:#f8fafc;border-radius:8px;margin-bottom:8px;padding:10px 12px;font-family:Amiri,serif;font-size:1.25rem;line-height:2.2}.compare-word--shared{color:#4f46e5;background:#6366f12e;border-radius:3px;padding:1px 3px}.compare-translation{color:#64748b;font-size:13px;line-height:1.6}.compare-translation p{margin:0}.compare-divider{border-left:1px solid #e2e8f0;border-right:1px solid #e2e8f0;flex-direction:column;flex:0 0 140px;justify-content:center;align-items:center;gap:8px;padding:12px 8px;display:flex}.compare-shared-title{text-transform:uppercase;letter-spacing:.5px;color:#94a3b8;font-size:11px;font-weight:600}.compare-shared-list{flex-wrap:wrap;justify-content:center;gap:4px;display:flex}.compare-chip{color:#6366f1;background:#6366f11a;border:1px solid #6366f133;border-radius:12px;padding:2px 8px;font-family:Amiri,serif;font-size:.95rem}.compare-no-shared{color:#94a3b8;text-align:center;font-size:12px}