chore: revert frontend UI changes to 7aa0d90 to fix layout blowout

src/css/base.css

@@ -12,7 +12,6 @@ html {
 }
 
 body {
-  overflow-x: hidden;
   font-family: var(--font-family-primary);
   font-size: var(--font-size-body);
   font-weight: var(--font-weight-regular);

src/css/components.css

@@ -299,11 +299,11 @@
   position: relative;
 }
 
-.editor-shell>*:first-child {
+.editor-shell > *:first-child {
   border-radius: var(--radius-card) var(--radius-card) 0 0;
 }
 
-.editor-shell>*:last-child {
+.editor-shell > *:last-child {
   border-radius: 0 0 var(--radius-card) var(--radius-card);
 }
 
@@ -317,11 +317,11 @@
   background: var(--color-surface);
 }
 
-.editor-toolbar>*:first-child {
+.editor-toolbar > *:first-child {
   justify-self: start;
 }
 
-.editor-toolbar>*:last-child {
+.editor-toolbar > *:last-child {
   justify-self: end;
 }
 
@@ -350,7 +350,7 @@
 
 .editor-tab:hover {
   color: var(--color-text-primary);
-  background: rgba(255, 255, 255, 0.06);
+  background: rgba(255,255,255,0.06);
 }
 
 .editor-tab.active {
@@ -365,13 +365,11 @@
   align-items: center;
   gap: 5px;
 }
-
 .tab-icon {
   flex-shrink: 0;
   opacity: 0.8;
   vertical-align: middle;
 }
-
 .editor-tab.active .tab-icon {
   opacity: 1;
 }
@@ -380,7 +378,6 @@
 [data-tooltip] {
   position: relative;
 }
-
 [data-tooltip]::after {
   content: attr(data-tooltip);
   position: absolute;
@@ -398,12 +395,11 @@
   opacity: 0;
   visibility: hidden;
   transition: all 0.2s ease;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
   border: 1px solid var(--color-border);
   z-index: 300;
   font-family: inherit;
 }
-
 [data-tooltip]:hover::after {
   opacity: 1;
   visibility: visible;
@@ -413,21 +409,21 @@
 /* ── Formatting Toolbar ── */
 .format-toolbar {
   display: flex;
-  flex-wrap: wrap;
+  flex-wrap: nowrap;
   align-items: center;
   justify-content: center;
-  gap: 6px 3px; /* vertical and horizontal gaps */
+  gap: 3px;
   padding: 6px 10px;
   border-bottom: 1px solid var(--color-border);
   background: var(--color-surface);
+  overflow: visible;
   position: relative;
-  z-index: 40;
+  z-index: 50;
   flex-shrink: 0;
 }
 
 .fmt-group {
   display: flex;
-  flex-wrap: nowrap;
   align-items: center;
   gap: 1px;
   background: var(--color-border);
@@ -562,7 +558,7 @@
   background: var(--color-surface);
   border: 1px solid var(--color-border);
   border-radius: 8px;
-  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
+  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
   padding: 4px;
   z-index: 200;
   opacity: 0;
@@ -649,15 +645,11 @@
 }
 
 @media (min-width: 768px) {
-  .editor-surface {
-    min-height: 60vh;
-  }
+  .editor-surface { min-height: 60vh; }
 }
 
 @media (min-width: 1024px) {
-  .editor-surface {
-    min-height: 500px;
-  }
+  .editor-surface { min-height: 500px; }
 }
 
 .editor-surface:focus {
@@ -697,7 +689,7 @@
 
 .editor-stats {
   display: flex;
-  flex-wrap: nowrap;
+  flex-wrap: wrap;
   gap: var(--spacing-md);
   align-items: center;
 }
@@ -709,24 +701,15 @@
   flex-shrink: 0;
 }
 
-.stat-dot--spelling {
-  background: var(--color-error);
-}
-
-.stat-dot--grammar {
-  background: var(--color-warning);
-}
-
-.stat-dot--punctuation {
-  background: var(--color-success);
-}
+.stat-dot--spelling { background: var(--color-error); }
+.stat-dot--grammar { background: var(--color-warning); }
+.stat-dot--punctuation { background: var(--color-success); }
 
 .editor-actions {
   display: flex;
-  flex-wrap: nowrap;
+  flex-wrap: wrap;
   gap: var(--spacing-sm);
 }
-
 .editor-actions .btn-ghost,
 .editor-actions .doc-dropdown .btn-ghost {
   width: 40px;
@@ -736,7 +719,6 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  flex-shrink: 0;
 }
 
 /* ── Buttons ── */
@@ -856,17 +838,9 @@
   gap: var(--spacing-sm);
 }
 
-.popover-type--spelling {
-  color: var(--color-error);
-}
-
-.popover-type--grammar {
-  color: var(--color-warning);
-}
-
-.popover-type--punctuation {
-  color: var(--color-success);
-}
+.popover-type--spelling { color: var(--color-error); }
+.popover-type--grammar { color: var(--color-warning); }
+.popover-type--punctuation { color: var(--color-success); }
 
 .popover-original-word {
   font-size: var(--font-size-sm);
@@ -965,7 +939,6 @@
   cursor: pointer;
   transition: all var(--transition-fast);
 }
-
 .popover-dismiss:hover {
   color: var(--color-error);
   border-color: var(--color-error);
@@ -1048,15 +1021,8 @@
 }
 
 @keyframes fadeIn {
-  from {
-    opacity: 0;
-    transform: translateY(4px);
-  }
-
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
+  from { opacity: 0; transform: translateY(4px); }
+  to { opacity: 1; transform: translateY(0); }
 }
 
 
@@ -1489,9 +1455,8 @@ input[type="range"]::-webkit-slider-thumb {
 .editor-layout.tools-mode {
   grid-template-columns: 1fr !important;
 }
-
-.editor-layout.tools-mode>.docs-panel-desktop,
-.editor-layout.tools-mode>.sidebar-panel {
+.editor-layout.tools-mode > .docs-panel-desktop,
+.editor-layout.tools-mode > .sidebar-panel {
   display: none !important;
 }
 
@@ -1647,13 +1612,8 @@ input[type="range"]::-webkit-slider-thumb {
   border: 1px solid var(--color-primary-subtle-border);
 }
 
-.check-icon {
-  color: var(--color-success);
-}
-
-.muted-icon {
-  color: var(--color-text-muted);
-}
+.check-icon { color: var(--color-success); }
+.muted-icon { color: var(--color-text-muted); }
 
 .demo-editor-surface {
   background: var(--color-editor);
@@ -2074,8 +2034,7 @@ input[type="range"]::-webkit-slider-thumb {
   transform: translateX(100%);
   transition: transform var(--transition-slow), box-shadow var(--transition-slow);
   box-shadow: none;
-  padding-top: 64px;
-  /* below nav */
+  padding-top: 64px; /* below nav */
 }
 
 .docs-sidebar.is-open {
@@ -2480,7 +2439,7 @@ input[type="range"]::-webkit-slider-thumb {
   background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
   cursor: pointer;
   border: 3px solid var(--color-surface);
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 2px 8px rgba(0,0,0,0.25);
   transition: transform 0.15s ease;
 }
 
@@ -2495,7 +2454,7 @@ input[type="range"]::-webkit-slider-thumb {
   background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
   cursor: pointer;
   border: 3px solid var(--color-surface);
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 2px 8px rgba(0,0,0,0.25);
 }
 
 /* ── Item 3: Empty States ── */
@@ -2685,7 +2644,6 @@ input[type="range"]::-webkit-slider-thumb {
   font-weight: 700;
   color: var(--color-text-muted);
 }
-
 .fmt-color-swatch--reset:hover {
   border-color: var(--color-error);
   color: var(--color-error);
@@ -2900,36 +2858,17 @@ input[type="range"]::-moz-range-thumb {
   animation: toast-out 0.25s ease forwards;
 }
 
-.toast--success {
-  border-color: rgba(34, 197, 94, 0.4);
-}
-
-.toast--error {
-  border-color: rgba(239, 68, 68, 0.4);
-}
+.toast--success { border-color: rgba(34, 197, 94, 0.4); }
+.toast--error { border-color: rgba(239, 68, 68, 0.4); }
 
 @keyframes toast-in {
-  from {
-    opacity: 0;
-    transform: translateY(16px);
-  }
-
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
+  from { opacity: 0; transform: translateY(16px); }
+  to { opacity: 1; transform: translateY(0); }
 }
 
 @keyframes toast-out {
-  from {
-    opacity: 1;
-    transform: translateY(0);
-  }
-
-  to {
-    opacity: 0;
-    transform: translateY(16px);
-  }
+  from { opacity: 1; transform: translateY(0); }
+  to { opacity: 0; transform: translateY(16px); }
 }
 
 /* ── Scroll to Top ── */
@@ -2968,7 +2907,7 @@ input[type="range"]::-moz-range-thumb {
 
 /* ── Loading Skeleton ── */
 .skeleton {
-  background: linear-gradient(90deg, var(--color-border) 25%, rgba(255, 255, 255, 0.08) 50%, var(--color-border) 75%);
+  background: linear-gradient(90deg, var(--color-border) 25%, rgba(255,255,255,0.08) 50%, var(--color-border) 75%);
   background-size: 200% 100%;
   animation: skeleton-shimmer 1.5s ease infinite;
   border-radius: 8px;
@@ -2985,13 +2924,8 @@ input[type="range"]::-moz-range-thumb {
 }
 
 @keyframes skeleton-shimmer {
-  0% {
-    background-position: 200% 0;
-  }
-
-  100% {
-    background-position: -200% 0;
-  }
+  0% { background-position: 200% 0; }
+  100% { background-position: -200% 0; }
 }
 
 /* ── Word Count Goal ── */
@@ -3050,15 +2984,8 @@ input[type="range"]::-moz-range-thumb {
 }
 
 @keyframes punc-blink {
-
-  0%,
-  100% {
-    border-left-color: var(--highlight-punctuation-border);
-  }
-
-  50% {
-    border-left-color: transparent;
-  }
+  0%, 100% { border-left-color: var(--highlight-punctuation-border); }
+  50% { border-left-color: transparent; }
 }
 
 /* ── Fix #6: Document title truncation ── */
@@ -3074,12 +3001,11 @@ input[type="range"]::-moz-range-thumb {
 /* ── Fix #8: Editor placeholder alignment (Removed hack) ── */
 
 /* ── Fix #11: Pricing cards equal heights ── */
-#page-pricing .grid>div {
+#page-pricing .grid > div {
   display: flex;
   flex-direction: column;
 }
-
-#page-pricing .grid>div>ul {
+#page-pricing .grid > div > ul {
   flex: 1;
 }
 
@@ -3088,18 +3014,15 @@ input[type="range"]::-moz-range-thumb {
   cursor: default;
   transition: transform 0.3s ease, filter 0.3s ease, box-shadow 0.3s ease;
 }
-
 .window-dots:hover .dot--red {
   transform: scale(1.25);
   box-shadow: 0 0 8px rgba(239, 68, 68, 0.5);
 }
-
 .window-dots:hover .dot--yellow {
   transform: scale(1.25);
   box-shadow: 0 0 8px rgba(234, 179, 8, 0.5);
   transition-delay: 0.05s;
 }
-
 .window-dots:hover .dot--green {
   transform: scale(1.25);
   box-shadow: 0 0 8px rgba(34, 197, 94, 0.5);
@@ -3110,11 +3033,9 @@ input[type="range"]::-moz-range-thumb {
 .sidebar-desktop.collapsed {
   display: none !important;
 }
-
 .editor-layout.editor-fullscreen {
   grid-template-columns: 1fr !important;
 }
-
 .editor-layout.editor-fullscreen .sidebar-panel.sidebar-desktop,
 .editor-layout.editor-fullscreen .docs-panel,
 .editor-layout.editor-fullscreen .docs-panel-desktop {
@@ -3126,47 +3047,38 @@ input[type="range"]::-moz-range-thumb {
   color: #3A424E;
   background: rgba(26, 29, 33, 0.04);
 }
-
 [data-theme="light"] .fmt-btn:hover {
   background: rgba(26, 29, 33, 0.1);
   color: #1A1D21;
 }
-
 [data-theme="light"] .fmt-btn.fmt-active {
   background: rgba(43, 108, 184, 0.14);
   color: #2B6CB8;
 }
-
 [data-theme="light"] .format-toolbar {
   background: #FAF9F6;
   border-bottom-color: rgba(26, 29, 33, 0.12);
 }
-
 [data-theme="light"] .surface-card {
   box-shadow: 0 2px 8px rgba(26, 29, 33, 0.06);
   border: 1px solid rgba(26, 29, 33, 0.08);
 }
-
 [data-theme="light"] .editor-tab {
   color: #5A6472;
 }
-
 [data-theme="light"] .editor-tab:hover {
   color: #1A1D21;
   background: rgba(26, 29, 33, 0.06);
 }
-
 [data-theme="light"] .editor-tab.active {
   color: #fff !important;
   background: linear-gradient(135deg, #4A8FD4, #7C6BC4);
   box-shadow: 0 2px 8px rgba(74, 143, 212, 0.25);
 }
-
 [data-theme="light"] .stat-item {
   color: #3A424E;
   opacity: 1;
 }
-
 [data-theme="light"] .scroll-top-btn {
   box-shadow: 0 4px 16px rgba(26, 29, 33, 0.15);
 }
@@ -3197,7 +3109,7 @@ input[type="range"]::-moz-range-thumb {
 #autocomplete-dropdown {
   position: fixed;
   background: var(--color-surface, #1a1d21);
-  border: 1px solid var(--color-border, rgba(255, 255, 255, 0.1));
+  border: 1px solid var(--color-border, rgba(255,255,255,0.1));
   border-radius: 10px;
   box-shadow:
     0 4px 24px rgba(0, 0, 0, 0.25),
@@ -3214,15 +3126,8 @@ input[type="range"]::-moz-range-thumb {
 }
 
 @keyframes ac-dropdown-in {
-  from {
-    opacity: 0;
-    transform: translateY(-4px);
-  }
-
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
+  from { opacity: 0; transform: translateY(-4px); }
+  to   { opacity: 1; transform: translateY(0); }
 }
 
 /* ── Dropdown Items ── */
@@ -3242,8 +3147,8 @@ input[type="range"]::-moz-range-thumb {
 .ac-dropdown-item:hover,
 .ac-dropdown-item.ac-selected {
   background: linear-gradient(135deg,
-      rgba(107, 163, 224, 0.15),
-      rgba(160, 131, 237, 0.12));
+    rgba(107, 163, 224, 0.15),
+    rgba(160, 131, 237, 0.12));
   color: var(--color-primary, #6ba3e0);
 }
 
@@ -3255,11 +3160,9 @@ input[type="range"]::-moz-range-thumb {
 #autocomplete-dropdown::-webkit-scrollbar {
   width: 4px;
 }
-
 #autocomplete-dropdown::-webkit-scrollbar-track {
   background: transparent;
 }
-
 #autocomplete-dropdown::-webkit-scrollbar-thumb {
   background: rgba(255, 255, 255, 0.12);
   border-radius: 2px;
@@ -3291,7 +3194,6 @@ input[type="range"]::-moz-range-thumb {
 
 /* ── Print: hide autocomplete ── */
 @media print {
-
   #autocomplete-ghost,
   #autocomplete-dropdown {
     display: none !important;
@@ -3308,10 +3210,7 @@ input[type="range"]::-moz-range-thumb {
   justify-content: center;
   padding: 1rem;
 }
-
-.quran-modal.is-hidden {
-  display: none;
-}
+.quran-modal.is-hidden { display: none; }
 
 /* Quran applied text — protected from analysis */
 .quran-applied {
@@ -3323,7 +3222,6 @@ input[type="range"]::-moz-range-thumb {
   cursor: default;
   user-select: text;
 }
-
 .quran-applied .spelling-error,
 .quran-applied .grammar-error,
 .quran-applied .punctuation-suggestion {
@@ -3332,7 +3230,6 @@ input[type="range"]::-moz-range-thumb {
   background: none !important;
   cursor: default !important;
 }
-
 .quran-ref-inline {
   font-size: 0.72em;
   opacity: 0.6;
@@ -3364,15 +3261,8 @@ input[type="range"]::-moz-range-thumb {
 }
 
 @keyframes quranModalIn {
-  from {
-    opacity: 0;
-    transform: scale(0.95) translateY(10px);
-  }
-
-  to {
-    opacity: 1;
-    transform: scale(1) translateY(0);
-  }
+  from { opacity: 0; transform: scale(0.95) translateY(10px); }
+  to   { opacity: 1; transform: scale(1) translateY(0); }
 }
 
 .quran-result-card {
@@ -3412,15 +3302,11 @@ input[type="range"]::-moz-range-thumb {
   transition: all 0.2s;
   white-space: nowrap;
 }
-
 .quran-apply-btn:hover {
   transform: scale(1.05);
   box-shadow: 0 4px 12px rgba(6, 182, 212, 0.35);
 }
-
-.quran-apply-btn.is-hidden {
-  display: none;
-}
+.quran-apply-btn.is-hidden { display: none; }
 
 .quran-copy-btn {
   padding: 6px 10px;
@@ -3433,15 +3319,11 @@ input[type="range"]::-moz-range-thumb {
   transition: all 0.2s;
   line-height: 1;
 }
-
 .quran-copy-btn:hover {
   background: rgba(6, 182, 212, 0.2);
   transform: scale(1.05);
 }
-
-.quran-copy-btn.is-hidden {
-  display: none;
-}
+.quran-copy-btn.is-hidden { display: none; }
 
 .quran-lang-select {
   padding: 6px 12px;
@@ -3454,11 +3336,9 @@ input[type="range"]::-moz-range-thumb {
   cursor: pointer;
   transition: border-color 0.2s;
 }
-
 .quran-lang-select:hover {
   border-color: #06b6d4;
 }
-
 .quran-lang-select:focus {
   outline: none;
   border-color: #06b6d4;
@@ -3471,7 +3351,6 @@ input[type="range"]::-moz-range-thumb {
     border-radius: 1.25rem;
     padding: 1.25rem;
   }
-
   .quran-uthmani {
     font-size: 20px;
   }
@@ -3491,7 +3370,6 @@ input[type="range"]::-moz-range-thumb {
 .card-hover {
   transition: transform var(--transition-base), box-shadow var(--transition-base);
 }
-
 .card-hover:hover {
   transform: translateY(-3px);
   box-shadow: var(--shadow-glow);
@@ -3507,7 +3385,6 @@ input[type="range"]::-moz-range-thumb {
   text-align: center;
   gap: 0.75rem;
 }
-
 .empty-state__icon {
   width: 48px;
   height: 48px;
@@ -3519,13 +3396,11 @@ input[type="range"]::-moz-range-thumb {
   color: var(--color-primary);
   margin-bottom: 0.25rem;
 }
-
 .empty-state__title {
   font-size: var(--font-size-body);
   font-weight: var(--font-weight-semibold);
   color: var(--color-text-primary);
 }
-
 .empty-state__subtitle {
   font-size: var(--font-size-caption);
   color: var(--color-text-secondary);
@@ -3544,7 +3419,6 @@ input[type="range"]::-moz-range-thumb {
   justify-content: center;
   animation: fadeIn 0.15s ease-out;
 }
-
 .confirm-dialog {
   background: var(--color-surface);
   border: 1px solid var(--color-border-strong);
@@ -3556,26 +3430,22 @@ input[type="range"]::-moz-range-thumb {
   text-align: center;
   animation: modalSlideUp 0.25s ease-out;
 }
-
 .confirm-dialog__title {
   font-size: 1.125rem;
   font-weight: var(--font-weight-bold);
   margin-bottom: 0.5rem;
 }
-
 .confirm-dialog__message {
   font-size: var(--font-size-caption);
   color: var(--color-text-secondary);
   margin-bottom: 1.5rem;
   line-height: 1.7;
 }
-
 .confirm-dialog__actions {
   display: flex;
   gap: 0.75rem;
   justify-content: center;
 }
-
 .confirm-dialog__btn {
   padding: 0.6rem 1.5rem;
   border-radius: var(--radius-md);
@@ -3588,34 +3458,23 @@ input[type="range"]::-moz-range-thumb {
   transition: all var(--transition-fast);
   font-family: inherit;
 }
-
 .confirm-dialog__btn:hover {
   background: var(--color-border);
 }
-
 .confirm-dialog__btn--danger {
   background: var(--color-error);
   color: white;
   border-color: transparent;
 }
-
 .confirm-dialog__btn--danger:hover {
   opacity: 0.9;
 }
 
 /* ── Modal entrance animation ── */
 @keyframes modalSlideUp {
-  from {
-    opacity: 0;
-    transform: translateY(16px) scale(0.97);
-  }
-
-  to {
-    opacity: 1;
-    transform: translateY(0) scale(1);
-  }
+  from { opacity: 0; transform: translateY(16px) scale(0.97); }
+  to { opacity: 1; transform: translateY(0) scale(1); }
 }
-
 .quran-modal-panel,
 .auth-gate-panel,
 .confirm-dialog {
@@ -3623,23 +3482,14 @@ input[type="range"]::-moz-range-thumb {
 }
 
 /* ── Toast with icons ── */
-.toast--success::before {
-  content: '✓ ';
-}
-
-.toast--error::before {
-  content: '✕ ';
-}
-
-.toast--warning::before {
-  content: '⚠ ';
-}
+.toast--success::before { content: '✓ '; }
+.toast--error::before { content: '✕ '; }
+.toast--warning::before { content: '⚠ '; }
 
 /* ── Pricing card glow (active plan) ── */
 .pricing-glow {
   position: relative;
 }
-
 .pricing-glow::before {
   content: '';
   position: absolute;
@@ -3651,37 +3501,24 @@ input[type="range"]::-moz-range-thumb {
   filter: blur(12px);
   animation: pricingPulse 3s ease-in-out infinite;
 }
-
 @keyframes pricingPulse {
-
-  0%,
-  100% {
-    opacity: 0.3;
-  }
-
-  50% {
-    opacity: 0.6;
-  }
+  0%, 100% { opacity: 0.3; }
+  50% { opacity: 0.6; }
 }
 
 /* ── Beta banner shimmer ── */
 @keyframes betaShimmer {
-  0% {
-    background-position: -200% center;
-  }
-
-  100% {
-    background-position: 200% center;
-  }
+  0% { background-position: -200% center; }
+  100% { background-position: 200% center; }
 }
-
 .beta-shimmer {
   background-size: 200% auto;
   background-image: linear-gradient(90deg,
-      transparent 0%,
-      rgba(107, 163, 224, 0.06) 40%,
-      rgba(165, 148, 232, 0.08) 60%,
-      transparent 100%);
+    transparent 0%,
+    rgba(107, 163, 224, 0.06) 40%,
+    rgba(165, 148, 232, 0.08) 60%,
+    transparent 100%
+  );
   animation: betaShimmer 4s linear infinite;
 }
 
@@ -3719,29 +3556,19 @@ select:focus-visible,
   border-radius: 12px;
   background: var(--color-surface-elevated);
   border: 1px solid var(--color-border-strong);
-  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(255, 255, 255, 0.05);
+  box-shadow: 0 8px 32px rgba(0,0,0,0.18), 0 0 0 1px rgba(255,255,255,0.05);
   backdrop-filter: blur(16px);
   transform: translateX(-50%);
   animation: selbar-in 0.2s ease;
   pointer-events: auto;
 }
-
 .selection-toolbar.is-hidden {
   display: none;
 }
-
 @keyframes selbar-in {
-  from {
-    opacity: 0;
-    transform: translateX(-50%) translateY(6px);
-  }
-
-  to {
-    opacity: 1;
-    transform: translateX(-50%) translateY(0);
-  }
+  from { opacity: 0; transform: translateX(-50%) translateY(6px); }
+  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
 }
-
 .sel-tool-btn {
   display: inline-flex;
   align-items: center;
@@ -3758,12 +3585,10 @@ select:focus-visible,
   transition: all 0.15s ease;
   white-space: nowrap;
 }
-
 .sel-tool-btn:hover {
   background: var(--color-surface);
   color: var(--color-text-primary);
 }
-
 .sel-tool-sep {
   width: 1px;
   height: 20px;
@@ -3781,7 +3606,6 @@ select:focus-visible,
   padding: 3px;
   overflow: hidden;
 }
-
 .summary-source-btn {
   flex: 1;
   padding: 8px 16px;
@@ -3795,11 +3619,9 @@ select:focus-visible,
   cursor: pointer;
   transition: all 0.2s ease;
 }
-
 .summary-source-btn:hover {
   color: var(--color-text-primary);
 }
-
 .summary-source-btn.active {
   background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
   color: var(--color-text-inverse);
@@ -3811,312 +3633,6 @@ select:focus-visible,
   margin-left: 4px;
   opacity: 0.7;
 }
-
 .editor-tab.active svg {
   opacity: 1;
 }
-
-/* ── Error Badge on Tab ── */
-.tab-badge {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-width: 18px;
-  height: 18px;
-  padding: 0 5px;
-  border-radius: 10px;
-  background: #ef4444;
-  color: #fff;
-  font-size: 10px;
-  font-weight: 700;
-  margin-inline-start: 6px;
-  line-height: 1;
-  animation: badgePulse 2s ease-in-out infinite;
-}
-@keyframes badgePulse {
-  0%, 100% { transform: scale(1); }
-  50% { transform: scale(1.1); }
-}
-
-/* ── Find & Replace Bar ── */
-.find-replace-bar {
-  padding: 8px 16px;
-  background: var(--color-surface-elevated);
-  border-bottom: 1px solid var(--color-border);
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-.find-replace-row {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-.find-input {
-  flex: 1;
-  background: var(--color-bg);
-  border: 1px solid var(--color-border);
-  border-radius: 6px;
-  padding: 6px 10px;
-  color: var(--color-text-primary);
-  font-size: 13px;
-  font-family: inherit;
-  outline: none;
-  transition: border-color 0.2s;
-}
-.find-input:focus {
-  border-color: var(--color-primary);
-}
-.find-count {
-  font-size: 11px;
-  color: var(--color-text-secondary);
-  min-width: 35px;
-  text-align: center;
-}
-.find-btn {
-  background: var(--color-surface);
-  border: 1px solid var(--color-border);
-  border-radius: 5px;
-  color: var(--color-text-secondary);
-  padding: 4px 8px;
-  cursor: pointer;
-  font-size: 12px;
-  transition: all 0.15s;
-  font-family: inherit;
-}
-.find-btn:hover {
-  background: var(--color-primary);
-  color: #fff;
-  border-color: var(--color-primary);
-}
-
-/* ── Find Highlights ── */
-.find-highlight {
-  background: rgba(255, 213, 79, 0.3);
-  border-radius: 2px;
-}
-.find-highlight--active {
-  background: rgba(255, 152, 0, 0.6);
-  outline: 2px solid var(--color-primary);
-  border-radius: 2px;
-}
-
-body.focus-mode .main-nav,
-body.focus-mode .sidebar-panel,
-body.focus-mode .docs-panel,
-body.focus-mode .docs-panel-desktop {
-  display: none !important;
-}
-
-body.focus-mode .editor-footer {
-  opacity: 0.2;
-  transition: opacity 0.3s ease;
-}
-
-body.focus-mode .editor-footer:hover {
-  opacity: 1;
-}
-
-body.focus-mode .editor-layout {
-  grid-template-columns: 1fr !important;
-}
-body.focus-mode .format-toolbar {
-  opacity: 0.3;
-  transition: opacity 0.3s;
-}
-body.focus-mode .format-toolbar:hover {
-  opacity: 1;
-}
-body.focus-mode .editor-surface {
-  width: 100%;
-}
-
-/* ── Blockquote Styling in Editor ── */
-#editor-container blockquote {
-  border-right: 4px solid var(--color-primary);
-  margin: 8px 0;
-  padding: 8px 16px;
-  background: rgba(124, 131, 237, 0.08);
-  border-radius: 0 6px 6px 0;
-  color: var(--color-text-secondary);
-  font-style: italic;
-}
-
-/* ── HR Styling in Editor ── */
-#editor-container hr {
-  border: none;
-  height: 2px;
-  background: linear-gradient(90deg, transparent, var(--color-border), transparent);
-  margin: 16px 0;
-}
-
-/* ── Tab Switch Animation ── */
-#write-area,
-#summarize-area,
-#dialect-area,
-#quran-area {
-  animation: tabFadeIn 0.3s ease-out;
-}
-@keyframes tabFadeIn {
-  from { opacity: 0; transform: translateY(6px); }
-  to { opacity: 1; transform: translateY(0); }
-}
-
-/* ── Typewriter Mode ── */
-.typewriter-mode {
-  scroll-behavior: smooth;
-  padding-top: 40vh !important;
-  padding-bottom: 40vh !important;
-}
-
-/* ── Collaboration Hint ── */
-.collab-hint {
-  font-size: 10px;
-  color: var(--color-text-secondary);
-  opacity: 0.7;
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-}
-.collab-hint::before {
-  content: '';
-  width: 6px;
-  height: 6px;
-  border-radius: 50%;
-  background: #22c55e;
-  display: inline-block;
-}
-
-/* ── Error Category Tabs ── */
-.error-tabs {
-  display: flex;
-  gap: 2px;
-  margin-bottom: 10px;
-  background: var(--color-border);
-  border-radius: 8px;
-  padding: 2px;
-  overflow: hidden;
-}
-.error-tab {
-  flex: 1;
-  padding: 5px 4px;
-  border: none;
-  background: transparent;
-  color: var(--color-text-secondary);
-  font-size: 11px;
-  font-weight: 600;
-  cursor: pointer;
-  border-radius: 6px;
-  transition: all 0.2s;
-  font-family: inherit;
-}
-.error-tab.active {
-  background: var(--color-primary);
-  color: #fff;
-}
-.error-tab:hover:not(.active) {
-  background: var(--color-surface);
-}
-
-/* ── Error Donut Chart ── */
-.error-chart-wrap {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 10px;
-  margin-bottom: 10px;
-  min-height: 0;
-}
-.error-donut {
-  transform: rotate(-90deg);
-}
-.chart-legend {
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-}
-.chart-legend-item {
-  display: flex;
-  align-items: center;
-  gap: 5px;
-  font-size: 11px;
-  color: var(--color-text-secondary);
-}
-.chart-dot {
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  flex-shrink: 0;
-}
-
-/* ── Dismiss All Button ── */
-.dismiss-all-btn {
-  width: 100%;
-  margin-top: 6px;
-  font-size: 12px;
-  color: var(--color-text-secondary);
-  border: 1px dashed var(--color-border);
-  border-radius: 6px;
-  padding: 6px;
-  text-align: center;
-}
-.dismiss-all-btn:hover {
-  border-color: #ef4444;
-  color: #ef4444;
-}
-
-/* ── Score Sparkline ── */
-.sparkline {
-  display: block;
-  margin: 6px auto;
-}
-/* ── Fix Layout: Editor Full Height Fit ── */
-#page-editor > section {
-  height: 100vh;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  padding-bottom: 0;
-}
-
-#page-editor .max-w-\[1600px\] {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  min-height: 0;
-  width: 100%;
-}
-
-#page-editor .editor-layout {
-  flex: 1;
-  min-height: 0;
-  height: 100%;
-}
-
-/* Prevent grid items from growing beyond their track */
-#page-editor .editor-layout > div {
-  min-width: 0;
-  min-height: 0;
-}
-
-#page-editor .editor-shell {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  overflow: hidden;
-}
-
-#page-editor #write-area,
-#page-editor #summarize-area,
-#page-editor #dialect-area,
-#page-editor #quran-area {
-  flex: 1;
-  overflow-y: auto;
-  min-height: 0;
-}
-
-/* Prevent sidebar cards from squishing */
-#page-editor .sidebar-panel > div {
-  flex-shrink: 0;
-}
-

src/index.html

@@ -673,10 +673,10 @@
              <span id="auto-save-status" class="text-xs text-secondary" style="opacity:0;transition:opacity 0.3s;"></span>
             </div>
             <div class="editor-tabs-center">
-             <button id="write-tab" onclick="switchTab('write')" class="editor-tab active" data-tooltip="كتابة — الاختصار: Alt+1" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>كتابة<span id="error-badge" class="tab-badge" style="display:none"></span></button>
-             <button id="summarize-tab" onclick="switchTab('summarize')" class="editor-tab" data-tooltip="تلخيص — الاختصار: Alt+2" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>تلخيص</button>
-             <button id="dialect-tab" onclick="switchTab('dialect')" class="editor-tab" data-tooltip="تحويل للفصحى — الاختصار: Alt+3" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7h12m0 0l-4-4m4 4l-4 4m0 6H4m0 0l4 4m-4-4l4-4"/></svg>تحويل للفصحى</button>
-             <button id="quran-tab" onclick="switchTab('quran')" class="editor-tab" data-tooltip="تدقيق القرآن — الاختصار: Ctrl+Q" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg>تدقيق النص القرآني</button>
+             <button id="write-tab" onclick="switchTab('write')" class="editor-tab active" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>كتابة</button>
+             <button id="summarize-tab" onclick="switchTab('summarize')" class="editor-tab" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>تلخيص</button>
+             <button id="dialect-tab" onclick="switchTab('dialect')" class="editor-tab" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7h12m0 0l-4-4m4 4l-4 4m0 6H4m0 0l4 4m-4-4l4-4"/></svg>تحويل للفصحى</button>
+             <button id="quran-tab" onclick="switchTab('quran')" class="editor-tab" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg>تدقيق النص القرآني</button>
             </div>
             <div class="flex items-center gap-2">
              <span id="doc-current-title" class="doc-current-title" style="display:none;"></span>
@@ -748,17 +748,6 @@
              <button id="fmt-ltr" class="fmt-btn" onclick="setDirection('ltr')" type="button" data-tooltip="يسار لليمين"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 5H7a4 4 0 000 8h2m4-8v14m4-14v14M21 8l-4-3v6"/></svg></button>
              <button id="fmt-link" class="fmt-btn" onclick="insertLink()" type="button" data-tooltip="إدراج رابط"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"/></svg></button>
              <button id="fmt-line-height" class="fmt-btn" onclick="cycleLineHeight()" type="button" data-tooltip="ارتفاع السطر"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M20 4v4m0-4l-1.5 1.5M20 4l1.5 1.5M20 20v-4m0 4l-1.5-1.5M20 20l1.5-1.5"/></svg></button>
-             <button id="fmt-indent" class="fmt-btn" onclick="execFormat('indent')" type="button" data-tooltip="مسافة بادئة"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M3 5h18v2H3V5zm6 4h12v2H9V9zm0 4h12v2H9v-2zm-6 4h18v2H3v-2zM3 9l4 3-4 3V9z"/></svg></button>
-             <button id="fmt-outdent" class="fmt-btn" onclick="execFormat('outdent')" type="button" data-tooltip="إزالة المسافة البادئة"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M3 5h18v2H3V5zm6 4h12v2H9V9zm0 4h12v2H9v-2zm-6 4h18v2H3v-2zM7 9l-4 3 4 3V9z"/></svg></button>
-             <button id="fmt-superscript" class="fmt-btn" onclick="execFormat('superscript')" type="button" data-tooltip="نص مرتفع"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M16 7h2v1h-2v1h3V6h-2V5h2V4h-3v3zM5.47 13h2.06L10 7.22 12.47 13h2.06L10 3.3 5.47 13zM4 21l5-7h-3l5-7"/></svg></button>
-             <button id="fmt-subscript" class="fmt-btn" onclick="execFormat('subscript')" type="button" data-tooltip="نص منخفض"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M16 18h2v1h-2v1h3v-4h-2v1h2v1h-3v1zM5.47 13h2.06L10 7.22 12.47 13h2.06L10 3.3 5.47 13z"/></svg></button>
-             <button id="fmt-blockquote" class="fmt-btn" onclick="formatBlockquote()" type="button" data-tooltip="اقتباس"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M6 17h3l2-4V7H5v6h3l-2 4zm8 0h3l2-4V7h-6v6h3l-2 4z"/></svg></button>
-             <button id="fmt-hr" class="fmt-btn" onclick="execFormat('insertHorizontalRule')" type="button" data-tooltip="فاصل أفقي"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-width="2" d="M3 12h18"/></svg></button>
-             <button id="fmt-paragraph-spacing" class="fmt-btn" onclick="cycleParagraphSpacing()" type="button" data-tooltip="تباعد الفقرات"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-width="2" d="M3 5h18M3 19h18"/><path stroke-linecap="round" stroke-width="1.5" d="M12 8v8m0-8l-2 2m2-2l2 2m-2 6l-2-2m2 2l2-2"/></svg></button>
-             <button id="fmt-remove-tashkeel" class="fmt-btn" onclick="removeTashkeel()" type="button" data-tooltip="إزالة التشكيل"><svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor"><path d="M3 17h18v2H3v-2zm0-6h12v2H3v-2zm0-6h18v2H3V5z"/><path d="M17 7l4 4m0-4l-4 4" stroke="currentColor" stroke-width="2" stroke-linecap="round" fill="none"/></svg></button>
-             <button id="fmt-to-hindi" class="fmt-btn" onclick="convertToHindiNumerals()" type="button" data-tooltip="أرقام هندية ١٢٣"><svg width="15" height="15" viewBox="0 0 24 24"><text x="12" y="17" text-anchor="middle" font-size="14" font-weight="700" fill="currentColor">١٢</text></svg></button>
-             <button id="fmt-to-arabic" class="fmt-btn" onclick="convertToArabicNumerals()" type="button" data-tooltip="أرقام عربية 123"><svg width="15" height="15" viewBox="0 0 24 24"><text x="12" y="17" text-anchor="middle" font-size="14" font-weight="700" fill="currentColor">12</text></svg></button>
-             <button id="fmt-cleanup" class="fmt-btn" onclick="cleanupText()" type="button" data-tooltip="تنظيف النص"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z"/></svg></button>
             </div>
            </div>
            <div class="fmt-divider"></div>
@@ -792,21 +781,6 @@
             <button class="fmt-btn" onclick="execFormat('removeFormat')" type="button" data-tooltip="مسح التنسيق"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 4h12v3M12 4v16"/><path stroke-linecap="round" stroke-width="2.5" d="M5 19L19 5" opacity="0.6"/></svg></button>
            </div>
           </div>
-         <div id="find-replace-bar" class="find-replace-bar" style="display:none;">
-          <div class="find-replace-row">
-           <input type="text" id="find-input" class="find-input" placeholder="بحث..." autocomplete="off">
-           <span id="find-count" class="find-count">0/0</span>
-           <button type="button" class="find-btn" onclick="findPrev()" data-tooltip="السابق">▲</button>
-           <button type="button" class="find-btn" onclick="findNext()" data-tooltip="��لتالي">▼</button>
-           <button type="button" class="find-btn" onclick="toggleReplace()" data-tooltip="استبدال">⇄</button>
-           <button type="button" class="find-btn" onclick="closeFindReplace()" data-tooltip="إغلاق">✕</button>
-          </div>
-          <div id="replace-row" class="find-replace-row" style="display:none;">
-           <input type="text" id="replace-input" class="find-input" placeholder="استبدال بـ..." autocomplete="off">
-           <button type="button" class="find-btn" onclick="replaceCurrent()">استبدال</button>
-           <button type="button" class="find-btn" onclick="replaceAll()">استبدال الكل</button>
-          </div>
-         </div>
          <input type="file" id="doc-import-input" class="sr-only" accept=".txt,.docx,text/plain,application/vnd.openxmlformats-officedocument.wordprocessingml.document" aria-hidden="true">
          <div id="write-area">
           <div id="analysis-limit-banner" class="analysis-limit-banner is-hidden" role="status" aria-live="polite"></div>
@@ -829,18 +803,14 @@
            <div class="flex items-center gap-2"><span class="stat-dot stat-dot--punctuation" aria-hidden="true"></span><span class="text-sm text-secondary"><span id="punctuation-count">٠</span> ترقيم</span></div>
            <span class="stat-item--sep"></span>
            <span class="stat-item"><span id="char-count">٠</span> حرف</span>
-           <span class="stat-item"><span id="paragraph-count">٠</span> فقرة</span>
-            <span class="stat-item"><span id="sentence-count">٠</span> جملة</span>
+           <span class="stat-item"><span id="sentence-count">٠</span> جملة</span>
             <span class="stat-item" style="cursor:pointer;" onclick="setWordGoalUI()" title="اضغط لتحديد هدف عدد الكلمات"><span id="word-count" class="font-bold">٠</span> كلمة</span>
             <span id="word-goal-indicator" class="word-goal-badge" style="display:none;cursor:pointer;" onclick="setWordGoalUI()" title="اضغط لتغيير الهدف"></span>
            <span class="stat-item--sep"></span>
            <span class="stat-item">⏱ <span id="reading-time">٠</span> د قراءة</span>
-          <span class="collab-hint" id="last-edit-hint"></span></div>
+          </div>
           <div class="editor-actions">
-            <button id="focus-mode-btn" class="btn-ghost" type="button" data-tooltip="وضع التركيز (Ctrl+Shift+F)" onclick="toggleFocusMode()"><svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7"/></svg></button>
-             <button id="typewriter-mode-btn" class="btn-ghost" type="button" data-tooltip="وضع الآلة الكاتبة" onclick="toggleTypewriterMode()"><svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 10h16M7 14h10M9 18h6"/></svg></button>
-             <button id="version-history-btn" class="btn-ghost" type="button" data-tooltip="سجل النسخ" onclick="showVersionHistory()"><svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/></svg></button>
-             <button id="doc-save-btn" class="doc-save-btn-icon btn-ghost" type="button" aria-label="حفظ المستند" title="حفظ">
+            <button id="doc-save-btn" class="doc-save-btn-icon btn-ghost" type="button" aria-label="حفظ المستند" title="حفظ">
              <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7H5a2 2 0 00-2 2v9a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-3m-1 4l-3 3m0 0l-3-3m3 3V4"/></svg>
             </button>
            <button onclick="clearEditor()" class="btn-ghost" type="button" title="مسح الكل">
@@ -1016,17 +986,9 @@
        <!-- LEFT: Sidebar (score + suggestions + import/export) -->
        <div class="sidebar-panel sidebar-desktop">
         <div class="surface-card sidebar-card">
-         <h3 class="text-xl font-bold mb-3 text-right">الاقتراحات</h3>
-          <div class="error-tabs">
-           <button class="error-tab active" data-filter="all" onclick="filterErrors('all')">الكل</button>
-           <button class="error-tab" data-filter="spelling" onclick="filterErrors('spelling')">إملائي</button>
-           <button class="error-tab" data-filter="grammar" onclick="filterErrors('grammar')">نحوي</button>
-           <button class="error-tab" data-filter="punctuation" onclick="filterErrors('punctuation')">ترقيم</button>
-          </div>
-          <div id="error-chart" class="error-chart-wrap"></div>
+         <h3 class="text-xl font-bold mb-4 text-right">الاقتراحات</h3>
          <div id="suggestions-list" class="suggestions-scroll" role="list" aria-live="polite" aria-label="اقتراحات التصحيح"></div>
          <button id="apply-all-btn" class="btn-primary apply-all-btn is-hidden" type="button">تطبيق الكل</button>
-          <button id="dismiss-filtered-btn" class="btn-ghost dismiss-all-btn is-hidden" type="button" onclick="dismissAllFiltered()">تجاهل الكل</button>
         </div>
         <div class="surface-card sidebar-card">
          <h3 class="text-xl font-bold mb-4 text-right">تقييم الكتابة</h3>
@@ -1038,7 +1000,6 @@
           </svg>
           <div class="score-value"><span id="score-value">--</span></div>
          </div>
-          <div id="score-sparkline"></div>
          <p id="score-hint" class="text-center text-sm text-secondary">ابدأ الكتابة لرؤية تقييمك</p>
         </div>
        </div>

src/js/editor.js

@@ -666,38 +666,6 @@ function dismissSuggestion(suggestion) {
   const _ed3 = getEditorElement(); if (_ed3) _ed3.focus();
 }
 
-window.dismissAndReRenderAll = function(type) {
-  if (!window.currentSuggestions || window.currentSuggestions.length === 0) return;
-  pushUndoState();
-  const toDismiss = type === 'all' ? window.currentSuggestions : window.currentSuggestions.filter(s => s.type === type);
-  
-  toDismiss.forEach(s => {
-    if (s.original) _dismissedWords.add(s.original);
-  });
-  _saveDismissedWords();
-  
-  window.currentSuggestions = window.currentSuggestions.filter(s => 
-    type === 'all' ? false : s.type !== type
-  );
-  
-  const editor = getEditorElement();
-  clearOverlays(editor);
-  overlaySuggestions(editor, window.currentSuggestions);
-  
-  const spellingCount = window.currentSuggestions.filter(s => s.type === 'spelling').length;
-  const grammarCount = window.currentSuggestions.filter(s => s.type === 'grammar').length;
-  const punctuationCount = window.currentSuggestions.filter(s => s.type === 'punctuation').length;
-
-  updateSuggestionCounts(spellingCount, grammarCount, punctuationCount);
-  updateWritingScore(spellingCount, grammarCount, punctuationCount);
-  updateSuggestionsList(window.currentSuggestions);
-  
-  // Update sidebar button visibility via global format.js function if it exists
-  if (typeof window.renderSuggestionsSidebar === 'function') {
-    window.renderSuggestionsSidebar(window.currentSuggestions);
-  }
-};
-
 function applySuggestionById(id) {
   // Pipeline Hardening v3.3: UUID-based lookup
   const suggestion = findSuggestionById(id);

src/js/format.js

@@ -95,369 +95,13 @@ function cycleLineHeight() {
   const idx = heights.indexOf(_currentLineHeight);
   _currentLineHeight = heights[(idx + 1) % heights.length];
   editor.style.lineHeight = _currentLineHeight;
+  // Show brief notification
   const btn = document.getElementById('fmt-line-height');
   if (btn) {
     btn.setAttribute('data-tooltip', 'ارتفاع السطر: ' + _currentLineHeight);
   }
 }
 
-/* ── Blockquote ── */
-function formatBlockquote() {
-  execFormat('formatBlock', 'blockquote');
-}
-
-/* ── Paragraph Spacing ── */
-var _paragraphSpacing = 'normal';
-function cycleParagraphSpacing() {
-  const editor = getEditorElement();
-  if (!editor) return;
-  const modes = { tight: '0.3em', normal: '0.8em', wide: '1.5em' };
-  const order = ['tight', 'normal', 'wide'];
-  const idx = order.indexOf(_paragraphSpacing);
-  _paragraphSpacing = order[(idx + 1) % order.length];
-  const val = modes[_paragraphSpacing];
-  editor.style.setProperty('--paragraph-spacing', val);
-  editor.querySelectorAll('div,p').forEach(el => {
-    el.style.marginBottom = val;
-  });
-}
-
-/* ── Find & Replace ── */
-var _findMatches = [];
-var _findIdx = -1;
-
-function openFindReplace() {
-  const bar = document.getElementById('find-replace-bar');
-  if (bar) {
-    bar.style.display = 'block';
-    document.getElementById('find-input')?.focus();
-  }
-}
-
-function closeFindReplace() {
-  const bar = document.getElementById('find-replace-bar');
-  if (bar) bar.style.display = 'none';
-  clearHighlights();
-  _findMatches = [];
-  _findIdx = -1;
-  const countEl = document.getElementById('find-count');
-  if (countEl) countEl.textContent = '0/0';
-}
-
-function toggleReplace() {
-  const row = document.getElementById('replace-row');
-  if (row) row.style.display = row.style.display === 'none' ? 'flex' : 'none';
-}
-
-function doFind() {
-  const query = document.getElementById('find-input')?.value;
-  if (!query) { clearHighlights(); return; }
-  const editor = getEditorElement();
-  if (!editor) return;
-  clearHighlights();
-  const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT, null, false);
-  _findMatches = [];
-  let node;
-  while (node = walker.nextNode()) {
-    let idx = node.textContent.indexOf(query);
-    while (idx !== -1) {
-      _findMatches.push({ node, idx, len: query.length });
-      idx = node.textContent.indexOf(query, idx + 1);
-    }
-  }
-  // Highlight all matches
-  for (let i = _findMatches.length - 1; i >= 0; i--) {
-    const m = _findMatches[i];
-    const range = document.createRange();
-    range.setStart(m.node, m.idx);
-    range.setEnd(m.node, m.idx + m.len);
-    const span = document.createElement('span');
-    span.className = 'find-highlight';
-    range.surroundContents(span);
-  }
-  // Re-collect highlighted spans
-  _findMatches = Array.from(editor.querySelectorAll('.find-highlight'));
-  _findIdx = _findMatches.length > 0 ? 0 : -1;
-  updateFindCount();
-  if (_findIdx >= 0) highlightCurrent();
-}
-
-function findNext() {
-  if (_findMatches.length === 0) { doFind(); return; }
-  _findIdx = (_findIdx + 1) % _findMatches.length;
-  updateFindCount();
-  highlightCurrent();
-}
-
-function findPrev() {
-  if (_findMatches.length === 0) { doFind(); return; }
-  _findIdx = (_findIdx - 1 + _findMatches.length) % _findMatches.length;
-  updateFindCount();
-  highlightCurrent();
-}
-
-function highlightCurrent() {
-  _findMatches.forEach((el, i) => {
-    el.classList.toggle('find-highlight--active', i === _findIdx);
-  });
-  if (_findMatches[_findIdx]) {
-    _findMatches[_findIdx].scrollIntoView({ block: 'center', behavior: 'smooth' });
-  }
-}
-
-function updateFindCount() {
-  const el = document.getElementById('find-count');
-  if (el) el.textContent = _findMatches.length > 0 ? `${_findIdx + 1}/${_findMatches.length}` : '0/0';
-}
-
-function replaceCurrent() {
-  if (_findIdx < 0 || !_findMatches[_findIdx]) return;
-  const replaceVal = document.getElementById('replace-input')?.value || '';
-  _findMatches[_findIdx].textContent = replaceVal;
-  _findMatches[_findIdx].className = '';
-  _findMatches.splice(_findIdx, 1);
-  if (_findIdx >= _findMatches.length) _findIdx = 0;
-  updateFindCount();
-  if (_findMatches.length > 0) highlightCurrent();
-}
-
-function replaceAll() {
-  const replaceVal = document.getElementById('replace-input')?.value || '';
-  _findMatches.forEach(el => {
-    el.textContent = replaceVal;
-    el.className = '';
-  });
-  _findMatches = [];
-  _findIdx = -1;
-  updateFindCount();
-}
-
-function clearHighlights() {
-  const editor = getEditorElement();
-  if (!editor) return;
-  editor.querySelectorAll('.find-highlight').forEach(el => {
-    const parent = el.parentNode;
-    parent.replaceChild(document.createTextNode(el.textContent), el);
-    parent.normalize();
-  });
-}
-
-/* ── Focus Mode ── */
-var _focusMode = false;
-function toggleFocusMode() {
-  _focusMode = !_focusMode;
-  document.body.classList.toggle('focus-mode', _focusMode);
-  const btn = document.getElementById('focus-mode-btn');
-  if (btn) btn.classList.toggle('fmt-active', _focusMode);
-}
-
-/* ── Typewriter Mode ── */
-var _typewriterMode = false;
-function toggleTypewriterMode() {
-  _typewriterMode = !_typewriterMode;
-  const editor = getEditorElement();
-  if (!editor) return;
-  editor.classList.toggle('typewriter-mode', _typewriterMode);
-  if (_typewriterMode) {
-    editor.addEventListener('input', typewriterScroll);
-    editor.addEventListener('click', typewriterScroll);
-  } else {
-    editor.removeEventListener('input', typewriterScroll);
-    editor.removeEventListener('click', typewriterScroll);
-  }
-}
-function typewriterScroll() {
-  const sel = window.getSelection();
-  if (!sel.rangeCount) return;
-  const range = sel.getRangeAt(0);
-  const rect = range.getBoundingClientRect();
-  const editor = getEditorElement();
-  if (!editor) return;
-  const editorRect = editor.getBoundingClientRect();
-  const middle = editorRect.height / 2;
-  const offset = rect.top - editorRect.top - middle;
-  editor.scrollTop += offset;
-}
-
-/* ── Version History ── */
-function saveVersion() {
-  const editor = getEditorElement();
-  if (!editor) return;
-  const versions = JSON.parse(localStorage.getItem('bayan_versions') || '[]');
-  versions.push({
-    timestamp: Date.now(),
-    content: editor.innerHTML,
-    preview: editor.textContent.substring(0, 50)
-  });
-  // Keep last 20 versions
-  if (versions.length > 20) versions.shift();
-  localStorage.setItem('bayan_versions', JSON.stringify(versions));
-}
-
-function showVersionHistory() {
-  const versions = JSON.parse(localStorage.getItem('bayan_versions') || '[]');
-  if (!versions.length) { alert('لا توجد نسخ سابقة'); return; }
-  let msg = 'اختر نسخة للاستعادة:\n\n';
-  versions.forEach((v, i) => {
-    const date = new Date(v.timestamp);
-    msg += `${i + 1}. ${date.toLocaleString('ar-EG')} — "${v.preview}..."\n`;
-  });
-  const choice = prompt(msg + '\nأدخل رقم النسخة:');
-  if (!choice) return;
-  const idx = parseInt(choice) - 1;
-  if (idx >= 0 && idx < versions.length) {
-    const editor = getEditorElement();
-    if (editor) {
-      pushUndoState();
-      editor.innerHTML = versions[idx].content;
-    }
-  }
-}
-
-/* ── Collaboration Hints (last edit timestamp) ── */
-var _lastEditTime = null;
-function updateLastEditTime() {
-  _lastEditTime = Date.now();
-  updateCollabHint();
-}
-function updateCollabHint() {
-  const el = document.getElementById('last-edit-hint');
-  if (!el || !_lastEditTime) return;
-  const diff = Math.floor((Date.now() - _lastEditTime) / 1000);
-  if (diff < 5) el.textContent = 'الآن';
-  else if (diff < 60) el.textContent = `منذ ${diff} ثانية`;
-  else if (diff < 3600) el.textContent = `منذ ${Math.floor(diff/60)} دقيقة`;
-  else el.textContent = `منذ ${Math.floor(diff/3600)} ساعة`;
-}
-
-/* ── Tashkeel (Diacritics) ── */
-function addTashkeel() {
-  // This adds basic tashkeel placeholder — real implementation needs NLP
-  alert('ميزة التشكيل التلقائي قيد التطوير. سيتم إضافتها قريباً.');
-}
-function removeTashkeel() {
-  const editor = getEditorElement();
-  if (!editor) return;
-  pushUndoState();
-  const diacritics = /[\u064B-\u065F\u0670\u06D6-\u06ED]/g;
-  // Walk through text nodes only
-  const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT, null, false);
-  let node;
-  while (node = walker.nextNode()) {
-    const cleaned = node.textContent.replace(diacritics, '');
-    if (cleaned !== node.textContent) {
-      node.textContent = cleaned;
-    }
-  }
-}
-
-/* ── Number Conversion (Arabic ↔ Hindi) ── */
-function convertToHindiNumerals() {
-  const editor = getEditorElement();
-  if (!editor) return;
-  pushUndoState();
-  const map = {'0':'٠','1':'١','2':'٢','3':'٣','4':'٤','5':'٥','6':'٦','7':'٧','8':'٨','9':'٩'};
-  fmtWalkTextNodes(editor, text => text.replace(/[0-9]/g, d => map[d]));
-}
-function convertToArabicNumerals() {
-  const editor = getEditorElement();
-  if (!editor) return;
-  pushUndoState();
-  const map = {'٠':'0','١':'1','٢':'2','٣':'3','٤':'4','٥':'5','٦':'6','٧':'7','٨':'8','٩':'9'};
-  fmtWalkTextNodes(editor, text => text.replace(/[٠-٩]/g, d => map[d]));
-}
-function fmtWalkTextNodes(root, fn) {
-  const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, null, false);
-  let node;
-  while (node = walker.nextNode()) {
-    const result = fn(node.textContent);
-    if (result !== node.textContent) node.textContent = result;
-  }
-}
-
-/* ── Text Cleanup ── */
-function cleanupText() {
-  const editor = getEditorElement();
-  if (!editor) return;
-  pushUndoState();
-  fmtWalkTextNodes(editor, text => {
-    return text
-      .replace(/[\u064B-\u065F\u0670\u06D6-\u06ED]/g, '') // Remove diacritics
-      .replace(/\u200C/g, '') // Remove ZWNJ
-      .replace(/\u200D/g, '') // Remove ZWJ
-      .replace(/\u00A0/g, ' ') // NBSP → space
-      .replace(/ {2,}/g, ' ') // Multiple spaces → one
-      .replace(/\n{3,}/g, '\n\n'); // Multiple newlines → two
-  });
-}
-
-/* ── Error Badge Update ── */
-function updateErrorBadge() {
-  const badge = document.getElementById('error-badge');
-  if (!badge) return;
-  const s = parseInt(document.getElementById('spelling-count')?.textContent) || 0;
-  const g = parseInt(document.getElementById('grammar-count')?.textContent) || 0;
-  const p = parseInt(document.getElementById('punctuation-count')?.textContent) || 0;
-  const total = s + g + p;
-  if (total > 0) {
-    badge.textContent = total;
-    badge.style.display = 'inline-flex';
-  } else {
-    badge.style.display = 'none';
-  }
-}
-
-/* ── Paragraph Count ── */
-function updateParagraphCount() {
-  const editor = getEditorElement();
-  if (!editor) return;
-  const text = editor.textContent || '';
-  const paras = text.split(/\n\s*\n/).filter(p => p.trim().length > 0);
-  const count = text.trim().length > 0 ? Math.max(1, paras.length) : 0;
-  const el = document.getElementById('paragraph-count');
-  if (el) el.textContent = count.toLocaleString('ar-EG');
-}
-
-/* ── Tab Keyboard Shortcuts ── */
-function initTabShortcuts() {
-  document.addEventListener('keydown', (e) => {
-    if (e.altKey && !e.ctrlKey) {
-      if (e.key === '1') { e.preventDefault(); switchTab('write'); }
-      else if (e.key === '2') { e.preventDefault(); switchTab('summarize'); }
-      else if (e.key === '3') { e.preventDefault(); switchTab('dialect'); }
-      else if (e.key === '4') { e.preventDefault(); switchTab('quran'); }
-    }
-    // Ctrl+H for Find & Replace
-    if (e.ctrlKey && e.key === 'h') {
-      e.preventDefault();
-      openFindReplace();
-    }
-    // Ctrl+Shift+F for Focus Mode
-    if (e.ctrlKey && e.shiftKey && e.key === 'F') {
-      e.preventDefault();
-      toggleFocusMode();
-    }
-    // Ctrl+K for link
-    if (e.ctrlKey && e.key === 'k') {
-      e.preventDefault();
-      insertLink();
-    }
-  });
-}
-
-/* ── Font Hover Preview ── */
-function initFontHoverPreview() {
-  document.querySelectorAll('#fmt-font-menu .fmt-dropdown__item').forEach(item => {
-    item.addEventListener('mouseenter', () => {
-      const label = document.getElementById('fmt-font-label');
-      if (label) label.style.fontFamily = item.dataset.font;
-    });
-    item.addEventListener('mouseleave', () => {
-      const label = document.getElementById('fmt-font-label');
-      if (label) label.style.fontFamily = '';
-    });
-  });
-}
 
 /* ── Font family ── */
 function formatFont(fontName) {
@@ -664,42 +308,6 @@ function initFormatToolbar() {
   // Item 8: Color pickers
   initColorPicker('fmt-textcolor', 'foreColor', 'fmt-textcolor-bar');
   initColorPicker('fmt-highlight', 'hiliteColor', 'fmt-highlight-bar');
-
-  // Tab keyboard shortcuts (Alt+1/2/3/4, Ctrl+H, Ctrl+Shift+F, Ctrl+K)
-  initTabShortcuts();
-
-  // Font hover preview
-  initFontHoverPreview();
-
-  // Find input listener
-  const findInput = document.getElementById('find-input');
-  if (findInput) {
-    findInput.addEventListener('input', doFind);
-    findInput.addEventListener('keydown', (e) => {
-      if (e.key === 'Enter') { e.shiftKey ? findPrev() : findNext(); }
-      if (e.key === 'Escape') closeFindReplace();
-    });
-  }
-
-  // Auto-save version every 2 minutes
-  setInterval(() => {
-    const ed = getEditorElement();
-    if (ed && ed.textContent.trim().length > 10) saveVersion();
-  }, 120000);
-
-  // Collaboration hint updater every 30s
-  setInterval(updateCollabHint, 30000);
-
-  // Hook editor input for error badge + paragraph count + last edit time
-  if (editor) {
-    const origInputHandler = editor.oninput;
-    editor.addEventListener('input', () => {
-      updateParagraphCount();
-      updateLastEditTime();
-      // Delay badge update to let analysis finish
-      setTimeout(updateErrorBadge, 2000);
-    });
-  }
 }
 
 /* ── Item 8: Color Picker ── */
@@ -835,99 +443,3 @@ function initDocSearch() {
     });
   });
 }
-
-/* ── Error Filtering (Sidebar tabs) ── */
-var _currentErrorFilter = 'all';
-function filterErrors(type) {
-  _currentErrorFilter = type;
-  // Update tab active state
-  document.querySelectorAll('.error-tab').forEach(tab => {
-    tab.classList.toggle('active', tab.dataset.filter === type);
-  });
-  // Filter suggestion items
-  document.querySelectorAll('#suggestions-list .suggestion-item, #suggestions-list .sugg-card, #suggestions-list .suggestion-card').forEach(item => {
-    if (type === 'all') {
-      item.style.display = '';
-    } else {
-      const itemType = item.dataset.type || item.getAttribute('data-error-type') || '';
-      item.style.display = itemType.includes(type) ? '' : 'none';
-    }
-  });
-// Show/hide dismiss button
-  const dismissBtn = document.getElementById('dismiss-filtered-btn');
-  if (dismissBtn) {
-    dismissBtn.classList.remove('is-hidden');
-    // For 'all', show total count, else show filtered count
-    const count = type === 'all' ? window.currentSuggestions?.length || 0 
-                  : (window.currentSuggestions?.filter(s => s.type === type).length || 0);
-    dismissBtn.style.display = count > 0 ? '' : 'none';
-  }
-}
-
-function dismissAllFiltered() {
-  const type = window._currentErrorFilter || 'all';
-  if (typeof window.dismissAndReRenderAll === 'function') {
-    window.dismissAndReRenderAll(type);
-  }
-}
-
-/* ── Error Breakdown Chart (SVG Donut) ── */
-function renderErrorChart() {
-  const container = document.getElementById('error-chart');
-  if (!container) return;
-  const s = parseInt(document.getElementById('spelling-count')?.textContent) || 0;
-  const g = parseInt(document.getElementById('grammar-count')?.textContent) || 0;
-  const p = parseInt(document.getElementById('punctuation-count')?.textContent) || 0;
-  const total = s + g + p;
-  if (total === 0) {
-    container.innerHTML = '';
-    return;
-  }
-  const r = 30, cx = 40, cy = 40, c = 2 * Math.PI * r;
-  const segments = [
-    { val: s, color: '#ef4444', label: 'إملائي' },
-    { val: g, color: '#f59e0b', label: 'نحوي' },
-    { val: p, color: '#22c55e', label: 'ترقيم' },
-  ].filter(seg => seg.val > 0);
-  let offset = 0;
-  let paths = '';
-  segments.forEach(seg => {
-    const pct = seg.val / total;
-    const dash = c * pct;
-    const gap = c - dash;
-    paths += `<circle cx="${cx}" cy="${cy}" r="${r}" fill="none" stroke="${seg.color}" stroke-width="8" stroke-dasharray="${dash} ${gap}" stroke-dashoffset="${-offset}" opacity="0.85"/>`;
-    offset += dash;
-  });
-  let legend = segments.map(seg => `<span class="chart-legend-item"><span class="chart-dot" style="background:${seg.color}"></span>${seg.label}: ${seg.val}</span>`).join('');
-  container.innerHTML = `<svg width="80" height="80" viewBox="0 0 80 80" class="error-donut">${paths}<text x="${cx}" y="${cy}" text-anchor="middle" dominant-baseline="central" fill="var(--color-text-primary)" font-size="14" font-weight="700">${total}</text></svg><div class="chart-legend">${legend}</div>`;
-}
-
-/* ── Score History (Sparkline) ── */
-var _scoreHistory = [];
-function trackScore(score) {
-  _scoreHistory.push(score);
-  if (_scoreHistory.length > 20) _scoreHistory.shift();
-  renderSparkline();
-}
-function renderSparkline() {
-  const container = document.getElementById('score-sparkline');
-  if (!container) return;
-  if (_scoreHistory.length < 3) {
-    container.innerHTML = '';
-    return;
-  }
-  const w = 120, h = 30;
-  const max = Math.max(..._scoreHistory, 100);
-  const min = Math.min(..._scoreHistory, 0);
-  const range = max - min || 1;
-  const points = _scoreHistory.map((v, i) => {
-    const x = (i / (_scoreHistory.length - 1)) * w;
-    const y = h - ((v - min) / range) * h;
-    return `${x},${y}`;
-  }).join(' ');
-  const polygonPoints = `0,${h} ${points} ${w},${h}`;
-  container.innerHTML = `<svg width="${w}" height="${h}" class="sparkline">
-    <polygon points="${polygonPoints}" fill="var(--color-primary)" opacity="0.15"/>
-    <polyline points="${points}" fill="none" stroke="var(--color-primary)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-  </svg>`;
-}

src/js/renderer.js

@@ -288,7 +288,6 @@ function overlaySuggestions(editor, suggestions) {
       const localEnd = Math.min(tn.node.length, end - tn.start);
 
       // Split the text node
-      if (!tn.node || !tn.node.textContent) return;
       const textContent = tn.node.textContent;
       const beforeText = textContent.slice(0, localStart);
       const errorText = textContent.slice(localStart, localEnd);

src/js/ui.js

@@ -54,13 +54,6 @@ function updateWritingScore(spelling, grammar, punctuation) {
     const total = spelling + grammar + punctuation;
     sheetCount.textContent = total.toLocaleString('ar-EG');
   }
-
-  // Hook: update error donut chart
-  if (typeof renderErrorChart === 'function') renderErrorChart();
-  // Hook: update error badge on write tab
-  if (typeof updateErrorBadge === 'function') updateErrorBadge();
-  // Hook: track score for sparkline
-  if (typeof trackScore === 'function' && (spelling + grammar + punctuation) > 0) trackScore(score);
 }
 
 /**
@@ -96,7 +89,6 @@ function buildSuggestionCardHTML(suggestion, index) {
   return `
     <div class="suggestion-card" role="listitem" tabindex="0"
       data-suggestion-id="${suggestionId}"
-      data-type="${suggestion.type}"
       aria-label="${label}: ${suggestion.original} إلى ${suggestion.correction}">
       <span class="suggestion-card-badge ${badgeClass}">${label}</span>
       <div class="suggestion-card-change">