Feature: Smooth sidebar animation, fixed theme button clipping, moved import to profile menu, added custom webapp context menu, and polished TickTick style detail panel

src/app/globals.css

@@ -62,8 +62,8 @@
   --dur-slow: 300ms;
 
   /* Layout */
-  --sidebar-width: 240px;
-  --detail-width: min(560px, 48vw);
+  --sidebar-width: 260px;
+  --detail-width: min(580px, 50vw);
   --header-height: 56px;
 }
 
@@ -1680,8 +1680,81 @@ a { color: inherit; text-decoration: none; }
   display: none;
 }
 
-@media (max-width: 768px) {
-  .mobile-only {
-    display: flex;
-  }
+/* ============================================
+   CUSTOM CONTEXT MENU
+   ============================================ */
+.custom-context-menu {
+  background: var(--bg-primary);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-md);
+  box-shadow: var(--shadow-lg);
+  padding: 5px;
+  min-width: 170px;
+  animation: dropdownIn var(--dur-fast) var(--ease-out);
+  backdrop-filter: blur(12px);
+  user-select: none;
+}
+
+.context-menu-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 7px 10px;
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--text-primary);
+  border-radius: var(--radius-xs);
+  cursor: pointer;
+  transition: background var(--dur-fast), color var(--dur-fast);
+}
+
+.context-menu-item:hover {
+  background: var(--bg-hover);
+  color: var(--accent);
+}
+
+.context-menu-item.danger {
+  color: var(--danger);
+}
+
+.context-menu-item.danger:hover {
+  background: rgba(239, 68, 68, 0.1);
+  color: var(--danger);
+}
+
+.context-menu-divider {
+  height: 1px;
+  background: var(--border);
+  margin: 4px 0;
+}
+
+.context-menu-icon {
+  font-size: 14px;
+  width: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0.8;
+}
+
+/* TickTick Style Meta Chip */
+.tick-meta-chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 4px 10px;
+  border-radius: var(--radius-full);
+  background: var(--bg-secondary);
+  border: 1px solid var(--border);
+  color: var(--text-secondary);
+  font-size: 12px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all var(--dur-fast);
+}
+
+.tick-meta-chip:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+  border-color: var(--border-medium);
 }