docs(docs): add Approach and Explanation sections with mermaid diagrams to problem pages

apps/docs/content/(hash-table)/141-linked-list-cycle.mdx

@@ -33,6 +33,20 @@ Can you solve it using O(1) (i.e. constant) memory?
 - `-10^5 <= Node.val <= 10^5`
 - pos is -1 or a valid index in the linked-list.
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["hasCycle(head)"]) --> I["fast = slow = head"]
+  I --> W{"fast and fast.next?"}
+  W -- no --> E(["return False — ran off the end, no cycle"])
+  W -- yes --> A["fast = fast.next.next — two steps"]
+  A --> B["slow = slow.next — one step"]
+  B --> Q{"fast is slow?"}
+  Q -- yes --> R(["return True — the gap closed, so it loops"])
+  Q -- no --> W
+```
+
 ## Solution
 
 ```py
@@ -54,3 +68,7 @@ class Solution:
                 return True
         return False
 ```
+
+## Explanation
+
+<YouTube id="gBTe7lFR3vc" title="Linked List Cycle - Floyd's Tortoise and Hare - Leetcode 141 - Python" />

apps/docs/content/(hash-table)/146-lru-cache.mdx

@@ -20,6 +20,31 @@ sidebar:
 - `0 <= value <= 10^5`
 - At most 2 * 10^5 calls will be made to get and put.
 
+## Approach
+
+```mermaid
+flowchart TD
+  subgraph state["state — dict for O(1) lookup, doubly linked list for O(1) reorder"]
+    H["head — least recent"] --- N["... nodes ..."] --- T["tail — most recent"]
+  end
+  subgraph get["get(key)"]
+    G1{"key in cache?"} -- no --> G2(["return -1"])
+    G1 -- yes --> G3["_remove_node then _add_node — move it beside the tail"]
+    G3 --> G4(["return node.value"])
+  end
+  subgraph put["put(key, value)"]
+    P1{"key in cache?"} -- yes --> P2["update value, _remove_node then _add_node"]
+    P1 -- no --> P3["new Node, cache[key] = node, _add_node"]
+    P3 --> P4{"len(cache) > capacity?"}
+    P4 -- yes --> P5["evict head.next — the least recent — and del cache[lru.key]"]
+    P4 -- no --> P6(["done"])
+    P2 --> P6
+    P5 --> P6
+  end
+  state --> get
+  state --> put
+```
+
 ## Solution
 
 ```py
@@ -84,3 +109,7 @@ class LRUCache:
 # param_1 = obj.get(key)
 # obj.put(key,value)
 ```
+
+## Explanation
+
+<YouTube id="7ABFKPK2hD4" title="LRU Cache - Twitch Interview Question - Leetcode 146" />

apps/docs/content/(hash-table)/1832-check-if-the-sentence-is-pangram.mdx

@@ -22,6 +22,19 @@ sidebar:
 - `1 <= sentence.length <= 1000`
 - `sentence` consists of lowercase English letters.
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["checkIfPangram(sentence)"]) --> I["freq = {}"]
+  I --> L{"more char c?"}
+  L -- yes --> C["freq[c] = (freq[c] or 0) + 1"]
+  C --> L
+  L -- no --> Q{"distinct keys in freq == 26?"}
+  Q -- yes --> R(["return true"])
+  Q -- no --> F(["return false"])
+```
+
 ## Solution
 
 ```js

apps/docs/content/(hash-table)/242-valid-anagram.mdx

@@ -25,6 +25,19 @@ What if the inputs contain Unicode characters? How would you adapt your solution
 - `1 <= s.length, t.length <= 5 * 10^4`
 - `s` and `t` consist of lowercase English letters.
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["isAnagram(s, t)"]) --> I["freq: count every char of s"]
+  I --> L{"more char c in t?"}
+  L -- no --> E(["return true"])
+  L -- yes --> Q{"freq[c] missing or 0?"}
+  Q -- yes --> R(["return false — t has a char s cannot cover"])
+  Q -- no --> D["freq[c] -= 1"]
+  D --> L
+```
+
 ## Solution
 
 ```js
@@ -46,3 +59,7 @@ var isAnagram = function(s, t) {
   return true;
 };
 ```
+
+## Explanation
+
+<YouTube id="9UtInBqnCgA" title="Valid Anagram - Leetcode 242 - Python" />

apps/docs/content/(hash-table)/3-longest-substring-without-repeating-characters.mdx

@@ -28,6 +28,21 @@ sidebar:
 - `0 <= s.length <= 10^5`
 - `s` consists of English letters, digits, symbols and spaces.
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["lengthOfLongestSubstring(s)"]) --> I["left = 0, ans = 0, window = set()"]
+  I --> L{"more (right, c) in s?"}
+  L -- no --> E(["return ans"])
+  L -- yes --> W{"c already in window?"}
+  W -- yes --> P["window.remove(s[left]); left += 1 — shrink until c is free"]
+  P --> W
+  W -- no --> A["window.add(c)"]
+  A --> M["ans = max(ans, right - left + 1)"]
+  M --> L
+```
+
 ## Solution
 
 ```py
@@ -45,3 +60,7 @@ class Solution:
 
         return ans
 ```
+
+## Explanation
+
+<YouTube id="wiGpQwVHdE0" title="Longest Substring Without Repeating Characters - Leetcode 3 - Python" />

apps/docs/content/(hash-table)/387-first-unique-character-in-a-string.mdx

@@ -26,6 +26,18 @@ sidebar:
 - `1 <= s.length <= 10^5`
 - `s` consists of only lowercase English letters.
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["firstUniqChar(s)"]) --> F["Pass 1 — freq: count every char of s"]
+  F --> L{"Pass 2 — more i in 0..len-1?"}
+  L -- no --> E(["return -1"])
+  L -- yes --> Q{"freq[s[i]] == 1?"}
+  Q -- yes --> R(["return i — leftmost wins because the scan is in order"])
+  Q -- no --> L
+```
+
 ## Solution
 
 ```js
@@ -45,3 +57,7 @@ var firstUniqChar = function (s) {
   return -1;
 };
 ```
+
+## Explanation
+
+<YouTube id="rBENYgWy3xU" title="First Unique Character in a String - Leetcode 387 - Python" />

apps/docs/content/(hash-table)/424-longest-repeating-character-replacement.mdx

@@ -24,6 +24,21 @@ sidebar:
 - `s` consists of only uppercase English letters.
 - `0 <= k <= s.length`
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["characterReplacement(s, k)"]) --> I["count = {}, res = 0, l = 0, maxF = 0"]
+  I --> L{"more (r, c) in s?"}
+  L -- no --> E(["return res"])
+  L -- yes --> A["count[c] += 1; maxF = max(maxF, count[c])"]
+  A --> W{"(r - l + 1) - maxF > k? — too many chars to replace"}
+  W -- yes --> P["count[s[l]] -= 1; l += 1 — shrink from the left"]
+  P --> W
+  W -- no --> M["res = max(res, r - l + 1)"]
+  M --> L
+```
+
 ## Solution
 
 ```py
@@ -45,3 +60,7 @@ class Solution:
             res = max(res, r - l + 1)
         return res
 ```
+
+## Explanation
+
+<YouTube id="gqXU1UyA8pk" title="Longest Repeating Character Replacement - Leetcode 424 - Python" />

apps/docs/content/(hash-table)/451-sort-characters-by-frequency.mdx

@@ -28,6 +28,18 @@ sidebar:
 - `1 <= s.length <= 5 * 10^5`
 - `s` consists of uppercase and lowercase English letters and digits.
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["frequencySort(s)"]) --> F["freq: count every char of s"]
+  F --> C["split s and sort with a two-key comparator"]
+  C --> K1["primary: freq[b] - freq[a] — most frequent first"]
+  C --> K2["tie-break: a.localeCompare(b) — alphabetical"]
+  K1 --> R(["join and return"])
+  K2 --> R
+```
+
 ## Solution
 
 ```js
@@ -47,3 +59,7 @@ var frequencySort = function (s) {
     .join("");
 };
 ```
+
+## Explanation
+
+<YouTube id="OXdXc9HTrIg" title="Sort Characters By Frequency - Leetcode 451 - Python" />

apps/docs/content/(hash-table)/567-permutation-in-string.mdx

@@ -22,6 +22,24 @@ sidebar:
 - `1 <= s1.length, s2.length <= 10^4`
 - `s1` and `s2` consist of lowercase English letters.
 
+## Approach
+
+```mermaid
+flowchart TD
+  S(["checkInclusion(s1, s2)"]) --> G{"k = len(s1) > len(s2)?"}
+  G -- yes --> X(["return False"])
+  G -- no --> I["need = Counter(s1), window = Counter()"]
+  I --> L{"more (right, c) in s2?"}
+  L -- no --> E(["return False"])
+  L -- yes --> A["window[c] += 1"]
+  A --> B{"right >= k? — window is now longer than k"}
+  B -- yes --> C["drop s2[right - k] from window, deleting the key at 0"]
+  B -- no --> Q
+  C --> Q{"window == need?"}
+  Q -- yes --> R(["return True"])
+  Q -- no --> L
+```
+
 ## Solution
 
 ```py
@@ -49,3 +67,7 @@ class Solution:
 
         return False
 ```
+
+## Explanation
+
+<YouTube id="UbyhOgBN834" title="Permutation in String - Leetcode 567 - Python" />